@charset 'UTF-8';
/* ------------------------------
　　headerのロゴ・サイトタイトル
------------------------------ */
.site-logo {
    width: 100px;
    padding-bottom:10px;
    float:left;/*サイトネームの下にサブタイトル設置のためfloat設定*/
}
@media (min-width: 768px){
.site-logo {
    width: 100px;
}}
@media (max-width: 480px){
.site-logo{
width: 50px;
}}
.site-name-text{
  float: left;/*下にサブタイトル設置のためfloat設定*/
  margin-bottom:0px;
  padding-bottom:0px;
  font-size: 40px;
  color: #0066cc;/*メインカラー*/
}
@media (min-width: 768px){
.site-name-text{
    font-size: 40px;
}}
@media (max-width: 480px){
.site-name-text{
    font-size: 34px;
}}
.site-name-text,.site-name-text a, .site-name-text a:active, .site-name-text a:focus, .site-name-text a:hover, .site-name-text a:visited {
    color: #0066cc;/*メインカラー*/
    font-weight: bolder;
}
/*サイトネームの下にサブタイトル設置*/
.originalSubTitle{
  float:left;
  margin:0px;
  padding:0px;
  font-size: 1em;
  color:#0066cc;
}
/*header右側の設定*/
.originalHeaderMail,.originalHeaderMail a, .originalHeaderMail a:active, .originalHeaderMail a:focus, .originalHeaderMail a:hover, .originalHeaderMail a:visited{
  text-decoration: none;
  color:#fff;
  border-radius: 0px 0px 3px 3px;
}
.originalHeaderTel{
  font-weight: bolder;
  font-size: 1.8em;
  margin-top:5px;
}
.originalHeaderTel a{
  text-decoration: none;
  color:#363636;
}
.originalHeaderAddress{
  font-size:1.2em;
}
/* ------------------------------
　　グローバルナビ・1カラム設定
------------------------------ */
@media (min-width: 1024px) {
  .header-nav {
     display: block;
     width: 100%;
     margin:0 auto;
     padding: 10px 5px;
     background-color: #0066cc;
    }
		.navbar > ul {
			float: right;
			list-style: none;
			padding: 0;
		}
		.navbar > ul {
			float: none;
			display: table;
			width: 100%;
			table-layout: fixed;
			border-right: 1px solid #fff;
		}
		.navbar li {
			position: relative;
			margin: 0 10px;
			vertical-align: middle;
			text-align: center;
		}
		.navbar li.navbar-btn {
			padding: 0 10px;
		}
		.navbar li {
			float: none;
			display: table-cell;
			border-left: 1px solid #fff;
		}
.navbar li a{
  color:#fff;
}}
/*ナビ・オンマウスの時の色*/
@media (min-width: 1024px){
.navbar li:hover a {
    border-bottom: 4px solid #4ac0a4;/*緑色*/
color:#fff;
}}
/*ナビ・stayの時の色*/
@media (min-width: 1024px){
.navbar li.stay a {
    border-bottom: 4px solid #4ac0a4;/*緑色*/
color:#fff;
}}
.navbar li a:hover,
.navbar li a:focus,
.navbar li a:active
{
  border-radius: 40px;
background: #4ac0a4;/*緑色*/
}
/* ------------------------------
　　suggest
------------------------------ */
.suggest-box {
    background: #e4f0fc;/*薄い水色*/
}
@media (min-width: 768px){
.btn-attention-block-large{
    max-width: 400px;
}}
.btn-attention-block-large {
background: #0066cc;
    font-size: 18px;
    font-weight: normal;
}
@media (max-width: 480px){
.btn-attention-block-large{
background: #c41134;
}}
@media (max-width: 480px){
  .btn-attention-block-large{
    font-size: 16px;
  }}
@media (max-width: 747px){
.suggest-btn {
    margin: 0 0 10px;
}}
/* ------------------------------
　　footer
------------------------------ */
.foot-wrapper {
    padding: 30px 0;
    background: #0066cc;
}
.footer-nav {
    clear:both;
    width: 100%;
    max-width: 100%;
    margin: 0 -10px;
}
.company-name {
    font-size: 24px;
}
@media (max-width: 747px){
  .company-name {
      font-size: 28px;
  }}
.company-detail {
    font-size: 20px;
}
@media (max-width: 747px){
  .company-detail {
      font-size: 24px;
  }}
.footer-nav-item {
    display: block;
    clear:both;
    width: 100%;
}
.footer-nav-list li {
float:left;
padding:10px;
font-size: 16px;
}
@media screen and (max-width: 767px){
.footer-nav-item ul{
  clear: both;
}}
@media screen and (max-width: 767px){
.footer-nav-list li{
padding:10px 10px 10px 0px;
font-size: 18px;
}}
@media screen and (max-width: 767px){
.footer-nav-list li::before{
  content: "・";
  color:#fff;
}}
.footer-nav-title {
float:left;
padding:10px;
font-size: 18px;
}
@media screen and (max-width: 767px){
.footer-nav-title{
padding:0px;
clear:both;
display: block;

}}
.footer-nav-list a {
    color: #fff;
}
/*フッターナビをスマホでも表示させる方法*/
@media screen and (max-width: 767px){
.footer-nav {
    display: block;
}}
/* ------------------------------
　　見出し
------------------------------ */
/*モジュール見出し・レイアウト*/
.module-header {
  position: relative;
  padding: .75em 1em;
  background-color: #e4f0fc;
  border-style: none;
  margin-bottom:.5em;
}
.module-header::before,
.module-header::after {
  content: '';
  position: absolute;
  top: 100%;
  border-style: solid;
  border-color: transparent;
}
.module-header::before {
  left: 0;
  border-width: 0 10px 10px 0;
  border-right-color: #0066cc;
}
.module-header::after {
  right: 0;
  border-style: solid;
  border-width: 10px 10px 0 0;
  border-top-color: #0066cc;
}
@media screen and (max-width: 767px){
.offcanvas-bar .module-header {
background-color: transparent;
border-bottom-style: none;
}}
/*モジュール見出し・テキスト*/
h2.module-heading{
  font-weight: normal;
  font-size: 1.5em;
}
/*エントリー・タイトル*/
.acms-page-header {
  padding: .25em 0 .25em .75em;
border-left: 6px solid #0066cc;
    border-bottom-style:none;
}
h1 {
    font-size: 2.5em;/*テキストのみ*/
}
/*エントリー・見出し中*/
.entry-column h3{
  padding: .3em .5em;
    background: -webkit-linear-gradient(top, #69b4e6 0%, #0066cc 100%);
    background: linear-gradient(to bottom, #69b4e6 0%, #0066cc 100%);
    color: #fff;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, .3);
    font-size: 1.6em;
    border-radius: 2px;
}
/*エントリー・見出し小*/
.entry-column h4{
    border-bottom:2px dashed #48832C;
    padding:4px 6px;
    font-size: 1.4em;
    }
    /* ------------------------------
　　モジュールのカスタマイズ
------------------------------ */
/*entrylistの最上部のborderなし*/
.acms-list-group {
    border-top-style: none;
}
/*entrylistの項目のbottomのborder*/
.acms-list-group-item {
border-bottom: 1px solid #0066cc;
}
/*topsummaryのborderなし*/
.summary-default,.summary-default-entry {
    border-style:none;
}
/*topsummaryのマウスオーバー時の背景色*/
.summary-default-entry.bl-hover{
  background-color: #e4f0fc;
}
/*topsummaryの見出しタイトル*/
.summary-title {
    font-size: 18px;
    background: -webkit-linear-gradient(top, #69b4e6 0%, #0066cc 100%);
    background: linear-gradient(to bottom, #69b4e6 0%, #0066cc 100%);
border-radius: 3px;
font-weight: bold;
  padding:5px 5px 5px 10px;
}
.summary-title a{
  color:#fff;
}
/*picuplistのタイトル*/
.pickup-title,.pickup-title a,.pickup-title a:link,.pickup-title a:visited,.pickup-title a:hover,.pickup-title a:active {
    color: #333;
    font-weight: bolder;
    -webkit-margin-after: 0em;
}
@media screen and (max-width: 767px){
  .pickup-title,.pickup-title a,.pickup-title a:link,.pickup-title a:visited,.pickup-title a:hover,.pickup-title a:active {
      color: #fff;
}}
.pickup-title{
  padding: .5em .75em;
  border-top: 1px dashed #0066cc;
}
@media screen and (max-width: 767px){
.pickup-title{
    border-top: 1px dashed #fff;
  }}
/* ------------------------------
　　entryのTable
------------------------------ */
.entry-column th,.entry-column td{
  border:1px solid #e4f0fc;
}
.entry-column th{
background-color: #0066cc;
color:#fff;
font-weight: normal;
}

@media screen and (min-width: 768px){
.entry-column td{
background-color: #ffffff;
}}
@media screen and (min-width: 768px){
  .entry-column th{
    white-space: nowrap;
  }}
  /* ------------------------------
  　　sliderカスタマイズ
  ------------------------------ */
  .main-slider-text-inner {
      display: table-cell;
      padding: 0px 20px;
      text-align: left;
      vertical-align:middle;
  }
  .main-slider-main-copy {
    color:#4ac0a4 ;
    font-family: 'Lobster';
    text-shadow: 2px 2px 0px #fff,
                 3px 3px 0px rgba(0,0,0,0.15);
  }}
  @media screen and (min-width: 768px){
.main-slider-main-copy {
  font-size: 50px;
}}
.main-slider-side-copy {
  text-shadow: #4ac0a4 2px 0px 0px, #4ac0a4 -2px 0px 0px,
    #4ac0a4 0px -2px 0px, #4ac0a4 0px 2px 0px,
    #4ac0a4 2px 2px 0px, #4ac0a4 -2px 2px 0px,
    #4ac0a4 2px -2px 0px, #4ac0a4 -2px -2px 0px,
    #4ac0a4 1px 2px 0px, #4ac0a4 -1px 2px 0px,
    #4ac0a4 1px -2px 0px, #4ac0a4 -1px -2px 0px,
    #4ac0a4 2px 1px 0px, #4ac0a4 -2px 1px 0px,
    #4ac0a4 2px -1px 0px, #4ac0a4 -2px -1px 0px,
    #4ac0a4 1px 1px 0px, #4ac0a4 -1px 1px 0px,
    #4ac0a4 1px -1px 0px, #4ac0a4 -1px -1px 0px;
}
@media screen and (min-width: 768px){
.main-slider-side-copy {
               font-size: 28px;
}}
.slick-dots li.slick-active button {
    background: #0066cc;
}
/* ------------------------------
　　topページ最上部
------------------------------ */
.originalTop{
  margin-bottom:20px;
}
.originalTop a:link,.originalTop a:visited,.originalTop a:hover,.originalTop a:active{
text-decoration: none;
color:#333;
}
.originalTopHead{
  font-size: 1.6em;
  font-weight: bolder;
  -webkit-margin-after: 0em;
  position: relative;
	display: inline-block;
 	margin:10px 0;
	padding: 7px 10px;
	min-width: 120px;
 	max-width: 100%;
 	color: #fff;
	background: #f2cf01;
	border-radius: 10px;
}
.originalTopHead::before{
  content: "";
	position: absolute;
	top: 100%;
	left: 50%;
 	margin-left: -15px;
	border: 15px solid transparent;
	border-top: 15px solid #f2cf01;
}
.originalTopTitle{
  margin-top:0px;
  font-size: 2.5em;
  background-color: #0066cc;
  color:#fff;
  text-align: center;
  line-height: 2em;
  font-weight: normal;
}
@media screen and (max-width: 480px){
.originalTopTitle{
  font-size: 1.8em;
  background-color: #0066cc;
  color:#fff;
  text-align: center;
  line-height: 1.6em;

}}
.originalTopSubTitle{
  font-size: 2em;
  -webkit-margin-before: 0em;
    -webkit-margin-after: 0em;
}
.originalTopTitlePoint{
  font-weight: bold;
  color:#4ac0a4;/*緑色*/
}
  .originalTopText {
    display: block;
    -webkit-margin-before: 0em;
    font-size: 1.5em;
}
.originalTopTextPoint{
  font-weight: bold;
  color:#ff0000;/*赤色*/
}
/* ------------------------------
　　unitカスタマイズ
------------------------------ */
/*定義リスト*/
.entry-column dt:before{
  content: "■";
  color:#0066cc;
  font-size: 1.5em;
}
.entry-column dd{
  margin-left: 1.5em;
}

/* ------------------------------
　　スマホメニュー
------------------------------ */
/*メニュー一覧の背景色*/
@media (max-width: 1023px){
.js-acms-offcanvas-active .offcanvas-bar {
    background: #0066cc;
}}
/*メニューheader*/
.site-header {
    border-top: 4px solid #0066cc;
    background: #0066cc;
}
/*headerアイコン*/
.nav-menu-action-item {
    font-size: 24px;
}
/*headerアイコンの色*/
.nav-menu-action-link,.nav-menu-action-link:active, .nav-menu-action-link:focus, .nav-menu-action-link:hover, .nav-menu-action-link:visited {
    color: #fff;
}
/*headerメニューボタン*/
.nav-menu-btn {
    font-size: 25px;
    height: 50px;
    padding: 5px 5px;
    color: #fff;
}
/*headerメニューテキスト*/
.nav-menu-btn-text {
    font-size: 20px;
    color: #fff;
}
@media screen and (min-width: 768px){
.serial-nav {
font-size: 1.2em;
}}

.Number {
    counter-reset:number; /* この要素ごとに数字をリセットする */
}
.midashi-f {
    position:relative;
    margin-left:80px;
    padding:8px 50px 6px;
    border-bottom:solid 2px #0066cc;
}

.midashi-f:before {
    counter-increment:number;
    content:counter(number);
    position:absolute;
    top:0;
    left:0px;
    padding:2.5px 10px;
    border:solid 2px #0066cc;
    color:#0066cc;
    font-weight: bold;
    font-size: 1.2em;
}
.Number p{
  margin-bottom:3px;
  font-size: 1.5em;
  font-weight: bold;
}
.entry-column table .yardTable{
  width:75%;
}
/*ポイント*/
p.point{
position: relative;
border-top: solid 2px #0066cc;
border-bottom: solid 2px #0066cc;
background: #f4f4f4;
line-height: 1.4;
padding: 0.4em 0.5em;
margin: 1em 0.5em 0.5em;
font-size: 1.5em;
color:#0066cc;
font-weight: bolder;
}

p.point::after {/*タブ*/
position: absolute;
font-family: "Font Awesome 5 Free",'Quicksand','Avenir','Arial',sans-serif;
content:"POINT";
background: #0066cc;
color: #fff;
left: 0px;
bottom: 100%;
border-radius: 5px 5px 0 0;
padding: 5px 7px 3px;
font-size: 0.8em;
line-height: 1;
letter-spacing: 0.05em;
  }
  /*ステップ*/
  p.step{
  position: relative;
  border-top: solid 2px #48832C;
  border-bottom: solid 2px #48832C;
  background: #fff;
  line-height: 1.4;
  padding: 0.4em 0.5em;
  margin: 1em 0.5em 0.5em;
  font-size: 1.5em;
  font-weight: bolder;
  }

  p.step::after {/*タブ*/
  position: absolute;
  font-family: "Font Awesome 5 Free",'Quicksand','Avenir','Arial',sans-serif;
  content:"STEP";
  background: #48832C;
  color: #fff;
  left: 0px;
  bottom: 100%;
  border-radius: 5px 5px 0 0;
  padding: 5px 7px 3px;
  font-size: 0.8em;
  line-height: 1;
  letter-spacing: 0.05em;
    }

    .video{
  position:relative;
  width:100%;
  padding-top:56.25%;
  margin-bottom:20px;
}

.video iframe{
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;

}
