@charset "UTF-8";

*,html	{font-family: "Hiragino Sans W3", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;font-size: 16px;line-height: 180%;box-sizing: border-box}

body	{color: #333;text-align: center;letter-spacing:0.05em;word-break: break-all;overflow: hidden;overflow-y:scroll;}

img	{width: 100%;height: auto;line-height: 0}
a:hover	{opacity: 0.5;transition: all 0.5s;}
p	{margin-bottom: 1em}
p.none	{margin-bottom: 0}

/*数字リスト*/
ul.decimal	{margin: 0 0 0.5em 1.2em;list-style-type: decimal}
ul.decimal:last-child	{margin: 0 0 0 1.2em;}
/*・リスト*/
ul.disc    {margin:0;list-style-type:none;font-size:100%;}
ul.disc    li{margin-left:0;text-indent:-1em;padding-left:1em;line-height:150%;}
ul.disc    li:before{content:"・"}
/*米印リスト*/
ul.kome{margin:0;list-style-type:none;font-size:100%}
ul.kome li{margin-left:-1em;text-indent:-1em;padding-left:2em;line-height:150%}
ul.kome li:before{content:"※"}

/*改行*/
.pconly{display:inline}
.w48,.w64,.w768,.w980{display:none}
@media screen and (max-width:1100px){.pconly{display:none}}
@media screen and (max-width:980px){.w980{display:inline}}
@media screen and (max-width:768px){.w768{display:inline}}
@media screen and (max-width:640px){.w64{display:inline}.w64none{display:none}}
@media screen and (max-width:480px){.w48{display:inline}}

	/*
　WRAP / PADDING
---------------------------*/

.cwrap	{max-width: 1040px;margin: 0 auto;text-align: left;}
@media only screen and (max-width: 1040px) {.cwrap	{max-width: auto;margin: 0 3%;}}
@media only screen and (max-width: 768px) {.cwrap	{max-width: auto;margin: 0 4%;}}

.cwrap-center	{max-width: 1200px;margin: 0 auto;text-align: center;}
@media only screen and (max-width: 1200px) {.cwrap-center	{max-width: auto;margin: 0 3%;}}
@media only screen and (max-width: 768px) {.cwrap-center	{max-width: auto;margin: 0 4%;}}

.cpadding {padding: 50px 0;}
@media only screen and (max-width: 768px) {.cpadding {padding: 40px 0;}}
.cpadding2 {padding: 0 0 70px 0;}
@media only screen and (max-width: 768px) {.cpadding2 {padding: 0 0 50px 0;}}
.cpadding3{padding: 0 0 40px 0;}
@media only screen and (max-width: 768px) {.cpadding2 {padding: 0 0 30px 0;}}
.cpadding4 {padding: 0 0 100px 0;}
@media only screen and (max-width: 768px) {.cpadding2 {padding: 0 0 50px 0;}}

	/*
　YOU TUBE
---------------------------*/

.video{position:relative;width:100%;padding-top:56.25%}
.video iframe{position:absolute;top:0;right:0;width:100%;height:100%}




	/*
　:root
---------------------------*/
:root {
--head-height: 110px;/*ヘッダのメニューの高さ*/
--head-height2: -110px;/*ヘッダのメニューの高さ調整分*/

--head-height-sp: 80px;/*SP時　ヘッダのメニューの高さ*/
--head-height2-sp: -80px;/*SP時　ヘッダのメニューの高さ調整分*/

--color-01: #fadbd9;
--color-02: #f3a3a4;
--color-03: #ef858c;
--color-04: #db2672;

}



/*---------------------------
　HEADER
---------------------------*/

#header	{height: var(--head-height);z-index:20000}

#header	{position: fixed;top: 0;left: 0;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;align-items: center;width: 100%;background: #fff;}

.head-inner	{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;width: 94%;margin: 0 3%}

.head-logo	{max-width: 330px;margin: 0;}

#g-nav ul	{display:-webkit-box;display:-ms-flexbox;display:flex;}
#g-nav li	{border-left: 3px dotted var(--color-02)}
#g-nav li:last-child	{border-right: 3px dotted var(--color-02)}
#g-nav li	a{display: block;padding: 1em;color: #333;font-family: 'Noto Sans JP', sans-serif;font-weight: 700;text-decoration: none}

.header-tel	{margin: 0 10px 0 0;text-align: center;}
.header-tel	a{color: var(--color-03);font-family: 'Noto Sans JP', sans-serif;font-weight: 700;text-decoration: none;}
.header-tel	a	i{margin-right: 5px;font-size: 35px;}
.head-tel-num	{font-size: 28px;}

.head-contact	{max-width: 100px;position: relative;margin: 0;}

.header-tel-sp,
.head-contact-sp,
.openbtn span	{display:none;}

@media screen and (max-width:1300px){

.head-inner	{width: 96%;margin: 0 2%}
.head-logo	{width: 24.5vw}
#g-nav li	a{font-size: 1.2vw}
.header-tel	a	i{font-size: 2.5vw;}
.head-tel-num	{font-size: 2vw}
.head-contact	{width: 30vw}

}


@media screen and (max-width:980px){
#header	{height: var(--head-height-sp);}

.header-tel,
.head-contact	{display:none;}
#g-nav li,#g-nav li:last-child	{border:none}

.header-tel-sp,
.head-contact-sp	{display:block;}

.head-contact-sp	{width: 100px;margin: 0 auto}
.header-tel-sp	a	{width: 80%;margin: 15px 10% 0 10%;border: 1px solid  var(--color-03);color: var(--color-03)}
.header-tel-sp	a	i{margin-right: 5px;font-size: 25px;}
.head-tel-num	{font-size: 20px}

.head-logo	{width: 280px}

#g-nav ul	{display:block;}

#g-nav{position:fixed;z-index:1;top:0;right:-120%;width:100%;height:100vh;background:var(--color-01);transition:all .6s}
#g-nav.panelactive{right:0}
#g-nav ul{position:absolute;z-index:1;top:50%;left:50%;width: 85%;transform:translate(-50%,-50%);}
#g-nav li{list-style:none;text-align:center}
#g-nav li a{display:block;padding: 15px 0;font-size: 1.2rem;color: var(--color-03);text-decoration:none;text-transform:uppercase;letter-spacing:.1em;font-weight:700}

.openbtn{position:fixed;top:11px;right:10px;z-index:2;cursor:pointer;width:50px;height:50px;}
.openbtn span{position:absolute;left:14px;height:3px;display:block;transition:all .4s;background:var(--color-03);width:50%}
.openbtn span:nth-of-type(1){top:15px}
.openbtn span:nth-of-type(2){top:23px}
.openbtn span:nth-of-type(3){top:31px}
.openbtn span:nth-of-type(4){top:41px;left:0;right: 0;width: 100%;background: none;font-size: 0.6rem;font-weight: 500;}

.openbtn.active span:nth-of-type(1){top:18px;left:18px;transform:translateY(6px) rotate(-45deg);width:30%}
.openbtn.active span:nth-of-type(2){opacity:0}
.openbtn.active span:nth-of-type(3){top:30px;left:18px;transform:translateY(-6px) rotate(45deg);width:30%}
.openbtn.active span:nth-of-type(4){opacity:0}
}



/**--MAIN--------------------*/

#maincontents	{padding-top: var(--head-height);}
/*.adjustment {padding-top: var(--head-height);margin-top: var(--head-height2);}*/
.adjustment {padding-top:150px;margin-top:-150px;}

#main	{position: relative;padding-bottom: 30px;}

@media screen and (max-width:980px){
#maincontents	{padding-top: var(--head-height-sp);}
/*.adjustment {padding-top:  var(--head-height-sp);margin-top: var(--head-height2-sp);}*/
.adjustment {padding-top:120px;margin-top:-120px;}
}


.block-title	{margin-top:-46px;line-height: 0;}

.block-title	.pc	{}
.block-title	.sp	{display: none}

@media screen and (max-width:768px){
.block-title	.pc		{display: none}
.block-title	.sp	{display: inline}
}

.block-line	{border-bottom: 8px solid var(--color-03)}

.contents-block	{background: var(--color-01)}
.contents-block.contactus	{margin-top: -46px;}

.contactus-block{padding: 50px 0 0 0;text-align: center;line-height: 0}
.contactus-block	a{display: block;width: 110px;margin: 0 auto;line-height: 0}


.contactus-block2{padding: 50px 0;}
.contactus-block2	a{display: block;margin: 0 auto;text-align: center;color: var(--color-03);font-size: 1.2rem;font-weight: bold;text-decoration: none;}
.contactus-block2	img{width: 110px;margin: 0 auto;}
.contactus-block2	span{display: block;margin: 0 auto;}





/*---------------------------
　PAGETOP
---------------------------*/

.page-top	{position: relative;text-align: right;z-index: 10000}
.page-top	a{display: block;width: 80px;height: 80px;margin: -50px 4% 0 auto;padding: 25px 0 0 0;color: #fff;border: 3px solid #fff;border-radius: 50%;background: #ccc;text-decoration: none;text-align: center;line-height: 1em;font-size: 10px;}
.page-top	a	span	{display: block;}
.page-top	a	.fa-angle-up	{font-size: 75px;line-height: 0;}
.page-top	a	span:nth-child(2)	{margin-top: -7px;}
.page-top	a:hover{background: var(--color-03);opacity: 1}



/*---------------------------
　FOOTER
---------------------------*/

#footer	{}
.footer-inner-wrap	{display: flex;align-items: center;flex-wrap: wrap;width: 94%;margin: 0 3%;padding: 20px 0 0 0}
.footer-logo	{flex-basis: 30%}
.footer-tel	{flex-basis: 28%}
.footer-link	{flex-basis: 42%}


.footer-logo	{margin: 0}
.footer-logo	img	{max-width: 300px}

.footer-tel	{margin: 0;text-align: center;}
.footer-tel	a{color: var(--color-03);font-family: 'Noto Sans JP', sans-serif;font-weight: 700;text-decoration: none;}
.footer-tel	a	i{margin-right: 5px;font-size: 34px;}
.footer-tel-num	{font-size: 33px;}

.footer-link	a{display: block;color: #666;text-align: center;text-decoration: none}

.footer-link-list	{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-pack: distribute;justify-content: space-around;width: 100%;}
.footer-link-list li	{flex-basis: 25%;padding: 15px 0;border-left: 3px dotted var(--color-02)}
.footer-link-list li:last-child	{border-right: 3px dotted var(--color-02)}

#copiright	{padding: 25px 10px;font-size: 0.8rem;}

@media screen and (max-width: 1200px){
.footer-logo	img	{max-width: 280px}
.footer-tel	a	i{font-size: 4vw;}
.footer-tel-num	{font-size: 3vw;}
}


@media screen and (max-width:980px){
.footer-logo,
.footer-tel,
.footer-link	{flex-basis: 100%}

.footer-logo	{margin-bottom: 20px;}
.footer-tel{margin-bottom: 10px;}
.footer-tel	a	i{font-size: 4vw;}
.footer-tel-num	{font-size: 4vw;}

.footer-link-list li,
.footer-link-list li:last-child	{border:none}
.footer-link	a{padding: 0.5em 0}
}

@media screen and (max-width:768px){
.footer-link-list	{flex-wrap: wrap;}
.footer-link-list li	{flex-basis: 33.33%;}
}

@media screen and (max-width:480px){
.footer-logo	{margin-bottom: 10px;}
.footer-tel{margin-bottom: 20px;}
.footer-tel	a	i{font-size: 8vw;}
.footer-tel-num	{font-size: 8vw;}


#copiright	{padding: 25px 10px;border-top: 1px solid var(--color-02);font-size: 0.6rem;}
}

/*------------------------
/////FADE/////////////////
------------------------*/

/*ひとつめのフェード*/
.fadeinf {animation-name: fadeinfanm;animation-duration: 1s;}
@keyframes fadeinfanm {
from {opacity: 0;transform: translateY(30px);}
to {opacity: 1;transform: translateY(0);}
}

/*ひとつめのフェード移動なし*/
.fadeinf1 {animation-name: fadeinfanm1;animation-duration: 1s;}
@keyframes fadeinfanm1 {
from {opacity: 0;}
to {opacity: 1;}
}


/*ふたつめ以降のフェード*/

.fadein {
opacity : 0;
transform : translate(0px, 100px);
transition : all 1000ms;
}
.fadein.scrollin {
opacity : 1;
transform : translate(0px, 0px);
}


@keyframes fadein {
from {
opacity: 0.1;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}

