@charset "utf-8";

/***************************************************/
/*基本設定を変数化*/
/***************************************************/
:root{
  --main-color: #0F467A;
  --sub-color: #00366B;
  --dark-color:#082D51;
  --dusty-color:#7292AF;
  --font-color: #000;
	--border-color: #C5C5C5;
  --bg-color:#D8E4EE;
  --bg-color2:#EFF3F6;
	--gray:#999;
	--light-gray:#f7f7f7; 
	--dark-gray:#666;
  /* font size */
  --fs-h2: calc(var(--fs-base)*1.5);
  --fs-h3: calc(var(--fs-base)*1.2);
  --fs-h4: calc(var(--fs-base)*1.15);

	}
@media screen and (min-width: 1024px) {
	:root{
	--fs-base:.18rem;
  --fs-caption:.14rem;
	--margin-small:.3rem;
	--margin-middle:.5rem;
	--margin-large:.8rem;
	--margin-full:calc((100vw - 100%)/-2);
	--padding-full:calc((100vw - 100%)/2);
  --section-padding-top-bottom:1.2rem;
	}
}
@media screen and (max-width: 1023px) {
	:root{
	--fs-base:.12rem;
  --fs-caption:.12rem;
	--margin-small:.2rem;
	--margin-middle:.3rem;
	--margin-large:.4rem;
	--margin-full:-.15rem;
	--padding-full:.15rem;
  --section-padding-top-bottom:.5rem;
	}
}




/***************************************************/
/*タグの再定義*/
/***************************************************/
*{ margin:0; padding:0; box-sizing: border-box; -webkit-text-size-adjust: 100%;min-width:0}
html{scroll-behavior: smooth;}
body{ font-size: var(--fs-base);line-height: 1.6; font-family: Arial, Helvetica, 'Noto Sans JP', sans-serif;overflow-wrap: break-word; -webkit-font-smoothing: antialiased; color: var(--font-color);}
h1, h2, h3, h4, h5, h6{ line-height: 1.6;font-weight: bold; font-size: inherit; word-break: auto-phrase;}
strong{font-weight: bold;}
a { color: inherit;}
a[href*="tel:"]{ text-decoration: none;}
table{ border-collapse: collapse; width: 100%;line-height: 1.6;table-layout: fixed;}
td, th{ text-align: left; vertical-align: top;}
li{list-style-type: none;}
img { border: none;width: 100%; height: auto;margin: auto;}
figure img { display: block;}
iframe[src*="youtube"],
iframe[src*="google.com/maps/"] { width: 100%; object-fit: fill;aspect-ratio:4/3; height: auto; display: block;}
@media screen and (min-width: 1024px) {
	[id^=cont_footer] { width: 100%;}
}
/*マウスオーバーアクション*/
/*---------------------------------------------*/
@media (hover: hover) {
	a { transition: opacity .3s ease;}
	a:hover { opacity: .5; text-decoration: none;}
}

/***************************************************/
/*ルートのフォントサイズ(1rem＝100px)*/
/***************************************************/
@media screen and (min-width: 1301px){
	html{ font-size: 100px;}
}
@media screen and (min-width: 1024px) and (max-width: 1300px){
	html{ font-size: calc((100vw*100)/1300);}
}
@media screen and (min-width: 751px) and (max-width: 1023px){
	html{ font-size: 160px;}
}
@media screen and (max-width: 750px){
	html{ font-size: calc((100vw*100)/375);}
}

/***************************************************/
/*基本レイアウト*/
/***************************************************/
#wrapper{ overflow: hidden;}
#back {z-index: 99;font-size: 9px; position: fixed; text-align: center;color: #fff; border-radius: 50%;transition: .3s ease;}
#back a { display: flex; justify-content: center; flex-direction: column;text-decoration: none; line-height: 1; height: 100%; width: 100%;align-items: center;background: rgba(0, 0, 0, 0.5) url(images/back@2x.png) no-repeat center/.24rem; border-radius: 50%;}
#copyright { text-align: center; font-size: .11rem;}
@media screen and (min-width: 1024px) {
	#copyright { padding: .2rem 0; }
	#back {width: .7rem; height: .7rem; bottom: .3rem;right: .2rem; line-height: .7rem;}
}
@media screen and (max-width: 1023px) {
	#wrapper { width: 100%; margin: auto; box-shadow: 0 0 10px rgba(0, 0, 0, 0.3); background: #fff;}
	#back {width: .5rem; height: .5rem; line-height: .5rem; right: .15rem; bottom: .2rem;}
  #back a {background-size: .2rem;}
	#copyright { padding: .1rem;}
}
@media screen and (min-width: 751px) and (max-width: 1023px) {
	body { background: #c9d9e9;}
	#wrapper { max-width: 600px;}
}



/***************************************************/
/* 任意のスタイル集 */
/***************************************************/
@media screen and (min-width: 1024px) {
  [class*="-inner"] {max-width: 12rem; margin: auto;}
	.for-sp{display: none !important;}
  .button{width: 8.4rem;margin: auto;}
}
@media screen and (max-width: 1023px) {
  [class*="-inner"] {max-width: 3.45rem; margin: auto;}
  .for-pc{display: none !important;}
  .button{text-align: center;}
  .button a img{width: 2.7rem;}
}



/***************************************************/
/*各セクションのスタイル集*/
/***************************************************/

/* PR */
.lp-head{background: var(--dark-color); padding: .08rem .1rem;}
.lp-head span{background: #fff;color: var(--sub-color); font-size: .12rem;display: block; padding: .2em 1em; line-height: 1; margin-left: auto;max-width: max-content;}
@media screen and (max-width: 1023px) {
  .lp-head span{ font-size: .1rem;}
}

/* アイキャッチ */
.lp-eyecatch-inner{max-width: 15.02rem;position: relative;}
.lp-eyecatch img{display: block; width: 100%; margin: auto;}
@media screen and (min-width: 1024px) {
  .lp-eyecatch{background: url(images/eyecatch-bg@2x.jpg) no-repeat center/cover;}
  .lp-eyecatch h1 img{ display: block;}
  .lp-eyecatch .button{width: 48.402%;position: absolute; top: 76.5671%; left: 10.053%;}
}
@media screen and (max-width: 1023px) {
  .lp-eyecatch{padding: 0;}
  .lp-eyecatch .button{max-width: 3.45rem; margin: var(--margin-small) auto;}
  .lp-eyecatch .button img{width: 100%;}
}

/* sec1 */
.lp-section1{background: url(images/sec1-bg@2x.png); padding: var(--section-padding-top-bottom) 0;}
@media screen and (min-width: 1024px) {
  .lp-section1 h2{width: 7.35rem;margin: auto; margin-bottom: .5rem;}
  .lp-section1 ul{display: flex;gap: .4rem;margin-bottom: .6rem;}
  .lp-section1 ul li{flex: 1 1;}
}
@media screen and (max-width: 1023px) {
  .lp-section1 ul{display: flex;gap: var(--margin-small);margin-bottom: var(--margin-middle);flex-direction: column;}
}

/* sec2 */
.lp-section2{background:var(--bg-color) url(images/sec2-bg@2x.png) repeat-x center bottom/auto 2.1rem; padding: var(--section-padding-top-bottom) 0 2.5rem;}
.lp-section2 ul{display: flex;gap: .5rem;flex-direction: column; margin-bottom: .6rem;}
@media screen and (min-width: 1024px) {
.lp-section2 ul li.has-source{position: relative;}
.lp-section2 ul li.has-source .source{position:absolute; top: 5.38rem; right: .7rem; width: 5.5rem; font-size: var(--fs-caption);line-height: 1.4;}
}
@media screen and (max-width: 1023px) {
.lp-section2{background-image: url(images/sec2-bg-sp@2x.png); background-size: 100%; padding-bottom: 1.06rem;}
.lp-section2 ul{gap: var(--margin-small); margin-bottom: var(--margin-middle);}
}

/* sec3 */
.lp-section3{background: url(images/sec3-bg@2x.jpg) no-repeat center/cover; padding: var(--section-padding-top-bottom) 0;}
.lp-section3-inner{background: rgba(255, 255, 255, 0.87);box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.25); padding: .7rem;}
.lp-section3 ul{display: flex;flex-direction: column; margin-bottom: .4rem;}
.lp-section3 ul li.has-source .source{font-size: var(--fs-caption);line-height: 1.4; text-align: right;}
@media screen and (max-width: 1023px) {
.lp-section3-inner{padding: 0 0 .2rem;}
.lp-section3 ul{margin-bottom: var(--margin-small);}
.lp-section3 ul li.has-source .source{ padding: 0 .15rem;}
}

/* sec4 会社紹介*/
.lp-company-profile{background:#EFEEE4 url(images/sec4-bg@2x.png) center/500px; padding: 0 0 var(--section-padding-top-bottom);}
.lp-company-profile h2{ background-color: var(--dark-color); padding: .4rem 0 .5rem;position: relative;text-align: center;}
.lp-company-profile h2::after{content: "";width:0;height:0;border-style:solid;border-width: .4rem .5rem 0 .5rem;border-color: var(--dark-color) transparent transparent transparent; position: absolute; left: 0; right: 0; bottom: -.4rem; margin: auto;}
.lp-company-profile h2 img{max-width: 12rem; width: 100%;}
.lp-company-profile h3{font-size: .36rem;text-align: center;}
.lp-company-profile h3::after{content: ""; display: block;height: 3px;width: .75rem;margin: .3rem auto;background: var(--main-color);}
.lp-company-profile h4{font-size: .25rem;color: var(--main-color);}
.lp-company-profile .profile-box{background: #FFFFFF;box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.25);padding: .7rem 1rem;margin-top: .8rem;}
.lp-company-profile .profile-box > *:not(:first-child){margin-top: .5rem;}
.lp-company-profile .profile-box :where(.source,.note){font-size: var(--fs-caption);text-align: right; margin-top: .15rem;}
.lp-company-profile .profile-box .profile-voice-child{display: grid; grid-template-columns: .92rem 1fr;gap: .35rem;font-size: .16rem; }
.lp-company-profile .profile-box .profile-voice-child::before{content: ""; background: url(images/sec4-item@2x.png) no-repeat center/contain; width: .92rem; height: 1.22rem; align-self: center;}
.lp-company-profile .profile-box .profile-voice-child:nth-child(2):before{background-image: url(images/sec4-item@2x.png)}
.lp-company-profile .profile-box .profile-voice-child:nth-child(3):before{background-image: url(images/sec4-item@2x.png)}
.lp-company-profile .profile-box .profile-voice-child .text{background-color: var(--bg-color2);position: relative;padding: .2rem .3rem;}
.lp-company-profile .profile-box .profile-voice-child .text::before{	right: 100%;top: .4rem;border: solid transparent;content: "";height: 0;width: 0;position: absolute;pointer-events: none;border-color: rgba(136, 183, 213, 0);border-right-color: var(--bg-color2);border-width: .15rem;}
.lp-company-profile .profile-box .profile-voice-child .text .source{font-size: .12rem;text-align: right;}
.lp-company-profile .profile-box .profile-voice-child:not(:first-child){margin-top: .45rem;}
.lp-company-profile .profile-box .profile-adress {line-height: 1.5;}
.lp-company-profile .profile-box .profile-adress .features {list-style-type: none;display: flex;gap: .08rem;margin-bottom: .16rem;flex-wrap: wrap;}
.lp-company-profile .profile-box .profile-adress .features li {color: #fff;list-style-type: none;padding: 0 .25rem;background: var(--dark-color);}
.lp-company-profile .profile-box .profile-adress .table {display: grid;grid-template-columns: 25% 1fr;margin-bottom: var(--margin-middle)}
.lp-company-profile .profile-box .profile-adress .table .head {border-bottom: 1px solid var(--border-color);padding: .27rem;font-weight: bold;display: flex;align-items: center;}
.lp-company-profile .profile-box .profile-adress .table .body {border-bottom: 1px solid var(--border-color);border-left: none;padding: .27rem .48rem}
.lp-company-profile .profile-box .profile-adress .table .body a[href^="https://maps"]::before {content: "";display: inline-block;vertical-align: middle;background: var(--icon-map) no-repeat center/contain;width: 1.5em;height: 1.5em; margin-right: .4em;}
.lp-company-profile .profile-box .profile-adress .img {display: flex;font-size: .14rem;gap: .26rem;flex-wrap: wrap;}
.lp-company-profile .profile-box .profile-adress .img>* {flex: 0 0 calc((100% - .26rem)/2);text-align: right;}
.lp-company-profile .profile-box .profile-adress .img .map iframe {width: 100%;height: auto; aspect-ratio: 488/350; object-fit: fill; outline: 1px solid var(--border-color) !important;outline-offset: -1px;}
.lp-company-profile .profile-box .profile-adress .img .photo img{width: 100%;height: auto; aspect-ratio: 488/350; object-fit: cover; object-position:left top; outline: 1px solid var(--border-color);outline-offset: -1px;}
@media screen and (min-width: 1024px) {
  .lp-company-profile { position: relative;z-index: 0;}
}
@media screen and (max-width: 1023px) {
  .lp-company-profile h2{  padding: .2rem .15rem;}
  .lp-company-profile h2::after{content: "";width:0;height:0;border-style:solid;border-width: .2rem .25rem 0 .25rem;border-color: var(--dark-color) transparent transparent transparent; position: absolute; left: 0; right: 0; bottom: -.2rem; margin: auto;}
  .lp-company-profile h3{font-size: var(--fs-h3);}
  .lp-company-profile h3::after{height: 1px;width: .5rem;margin: .15rem auto;}
  .lp-company-profile h4{font-size: var(--fs-h4);}
  .lp-company-profile .profile-box{margin-top: var(--margin-large); padding: .3rem .2rem;}
  .lp-company-profile .profile-box > *:not(:first-child){margin-top: var(--margin-small);}
  .lp-company-profile .profile-box .profile-voice-child{grid-template-columns: .4rem 1fr;gap: .2rem; font-size: inherit;}
  .lp-company-profile .profile-box .profile-voice-child::before{content: ""; aspect-ratio: 92/122; width: 100%; height: auto; margin-top: .3rem; align-self: flex-start;}
  .lp-company-profile .profile-box .profile-voice-child .text::before{ border-width: .1rem;}
  .lp-company-profile .profile-box .profile-voice-child:not(:first-child){margin-top: var(--margin-small);}
  .lp-company-profile .profile-box .profile-adress .features li {padding: 0 .1rem;}
  .lp-company-profile .profile-box .profile-adress .table {grid-template-columns: 1rem 1fr;}
  .lp-company-profile .profile-box .profile-adress .table .head,
  .lp-company-profile .profile-box .profile-adress .table .body {padding: .1rem;}
  .lp-company-profile .profile-box .profile-adress .img {display: block; width: 90%;margin: auto;font-size: inherit;}
  .lp-company-profile .profile-box .profile-adress .img > * {margin-bottom: .15rem;}
}

/* sec5 FAQ */
.lp-faq {padding: var(--section-padding-top-bottom) 0;}
.lp-faq h2{font-size: .6rem;text-align: center;margin-bottom: .6rem;}
.lp-faq .tm-faq .item{padding: 2em 2em 2em 5em; border-top: 1px solid var(--gray); position: relative;font-size: .28rem;}
.lp-faq .tm-faq .question{ margin-bottom: .3em;}
.lp-faq .tm-faq .question::before{ content: "Q"; font-family: Arial, Helvetica, "sans-serif"; position: absolute; font-size: 1.2em; left: calc(2em/1.2); top: calc(1.7em/1.2); background: var(--dark-color);color: #fff;border-radius: 50%;text-align: center; height: 1.8em; width: 1.8em; line-height: 1.8;}
.lp-faq .tm-faq .answer{font-size: var(--fs-base);}
@media screen and (max-width:1023px) {
  .lp-faq h2{font-size: var(--fs-h2);margin-bottom: var(--margin-small);}
  .lp-faq .tm-faq .item{padding: 2em 0 2em 2.8em; font-size: 1.15em;}
  .lp-faq .tm-faq .question::before{  left: 0;}
}

/* sec6 */
.lp-section6{background: url(images/sec6-bg@2x.jpg) no-repeat center/cover; padding: var(--section-padding-top-bottom) 0;}
.lp-section6-inner{position: relative;}
.lp-section6-inner .button{position: absolute; top: 3.93rem; width: 9.26rem; margin: auto; left: 0; right: 0;}
@media screen and (max-width:1023px) {
  .lp-section6{background-image: url(images/sec6-bg-sp@2x.jpg);}
  .lp-section6-inner .button{top: 1.38rem; width: 2.85rem;}
}

