@charset "UTF-8";

*,html	{font-family: 'Noto Sans JP', 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: 1200px;margin: 0 auto;text-align: left;}
@media only screen and (max-width: 1300px) {.cwrap	{max-width: auto;margin: 0 3%;}}
@media only screen and (max-width: 768px) {.cwrap	{max-width: auto;margin: 0 4%;}}

.cpadding {padding: 50px 0;}
.cpadding-bottom {padding: 0 0 50px 0;}
.cpadding-bottom-02 {padding: 0 0 20px 0;}

@media only screen and (max-width: 768px) {
.cpadding {padding: 40px 0;}
.cpadding-bottom {padding: 0 0 50px 0;}
.cpadding-bottom-02 {padding: 0 0 20px 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: 220px;/*ヘッダのメニューの高さ*/
--head-height2: -220px;/*ヘッダのメニューの高さ調整分*/

--head-height-scrollup: 80px;/*ヘッダのメニューの高さ*/
--head-height-scrollup2: -80px;/*ヘッダのメニューの高さ調整分*/

--color-01: #143571;

/*背景カラーリング調整*/
--bgcolor-01: #e6e2e2;/*#003366;*/
--bgcolor-02: #e6e2e2;
}


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

#header	{height: var(--head-height);transition: all 0.5s;z-index:20000}
#header.scrollup	{height: var(--head-height-scrollup);box-shadow: 0 2px 2px rgba(0,0,0,0.1);}

#header	{position: fixed;top: 0;left: 0;display:flex;justify-content: center;align-items: center;flex-direction: column;width: 100%;background: #fff;}

.head-logo	{max-width: 500px;margin-bottom: 15px;transition: all 0.5s;}
.description	{font-family: 'Noto Serif JP', serif;line-height: 1.5em;transition: all 0.5s;}

#header.scrollup	.head-logo	{max-width: 300px;margin: 12px 0 0 0;}
#header.scrollup	.description	{opacity: 0}

#g-nav ul	{display:block;}

#g-nav{position:fixed;z-index:1;top:0;left: 100%;right:-120%;width:100%;height:100vh;background:rgba(0,0,0,.8);transition:all .6s}
#g-nav.panelactive{width:110%;left: -5%;right: -5%}
#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-family: 'Noto Serif JP', serif;font-size: 1.2rem;color:#fff;text-decoration:none;text-transform:uppercase;letter-spacing:.1em;font-weight:700}
#g-nav li a	span{display: block;}
#g-nav li a	span:nth-child(2){margin-top: 10px;color: #ccc;font-size: 0.75em;}


#g-nav li.contactus	{margin-bottom: 30px;}

#g-nav li.small a	{margin-bottom: 10px;padding: 5px 0;font-size: 0.8rem;}


.openbtn{position:fixed;top:10px;right:10px;z-index:2;cursor:pointer;width:50px;height:50px;background:rgba(255,255,255,.4);}
.openbtn span{position:absolute;left:14px;height:3px;display:inline-block;transition:all .4s;border-radius:2px;background:#333;width:45%}
.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:40px;left:0;right: 0;width: 100%;height: 11px;font-size: 11px;background: none;text-align: center;white-space: nowrap;}

.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){display: none}

@media screen and (max-width: 980px){
.description	{font-size: 0.85rem}
}

@media screen and (max-width:768px){
#header,#header.scrollup	{height: var(--head-height-scrollup);box-shadow: 0 2px 2px rgba(0,0,0,0.1);}
.head-logo,
#header.scrollup	.head-logo	{max-width: 300px;margin: 5px 30px 0 0;;}
.description	{display: none}
#g-nav li a{padding: 10px 0;font-size: 1.1rem;}
	
#g-nav li.contactus	{margin-bottom: 20px;}
}

@media screen and (max-width:480px){
.head-logo,
#header.scrollup	.head-logo	{max-width: 220px;margin: 5px 30px 0 0;}

}


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

#maincontents	{padding-top: var(--head-height);}
.adjustment {padding-top:  var(--head-height-scrollup);margin-top: var(--head-height-scrollup2);}

#main	{position: relative;padding: 40px 0;}

.adjustment-contents {}

@media screen and (max-width:768px){
#maincontents	{padding-top: var(--head-height-scrollup)}

}

/*---------------------------
　PAGE TITLE
---------------------------*/

.page-title	{padding: 30px 0;font-family: 'Noto Serif JP', serif;background: #fafafa;;text-align: left;}
.page-title-wrap	{padding: 10px 20px;border-left: 1px solid #000}

.page-title	span{display: block;}
.page-title	.ja	{margin-bottom: 10px;font-size: 2rem;}
.page-title	.en	{color: #666}

@media screen and (max-width:768px){
.page-title	{padding: 20px 0;}
.page-title-wrap	{padding: 10px 15px}
.page-title	.ja	{margin-bottom: 5px;font-size: 1.5rem;}
.page-title	.en	{font-size:0.8em;}
}



.sub-title	{display: flex;justify-content: space-between;align-items: flex-end;margin-bottom: 30px;padding: 0 10px 10px 0;border-bottom: 1px solid #000;font-family: 'Noto Serif JP', serif;}
.sub-title	.ja	{font-size: 1.8rem;line-height: 1.6em;}
.sub-title	.en	{color: #666}

@media screen and (max-width:768px){
.sub-title	{flex-wrap: wrap}
.sub-title	.ja,
.sub-title	.en	{flex-basis: 100%}
.sub-title	.ja	{font-size: 1.4rem;}
}

.sub-title-02	{display: flex;margin-bottom: 30px;font-family: 'Noto Serif JP', serif;color: #fff}
.sub-title-02	.ja	{display: block;width: 180px;padding: 5px 0;background: #000;font-size: 1.2rem;font-weight: 600;text-align: center;line-height: 1.2em;border-left: solid 10px #666}

.sub-title-02.wide	.ja	{width: auto;padding: 5px 20px;text-align:left}


.sub-title-02	.en	{display: block;}


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

.footer-contact	{padding: 70px 0 0 0;font-family: 'Noto Serif JP', serif;background: linear-gradient(180deg, var(--bgcolor-01) 0%,  var(--bgcolor-01) 65%, #333 65%, #333 100%);}
.footer-contact-inner	{max-width: 900px;margin: 0 auto;padding: 35px 0 20px;background: #fff;box-shadow: 0 7px 7px rgba(0,0,0,0.5);}

.footer-contact-title	{margin-bottom: 20px;}
.footer-contact-title	span{display: block;}
.footer-contact-title	.ja	{margin-bottom: 7px;font-size: 1.7rem;}
.footer-contact-title	.en	{color: #999;font-size: 0.85em;}

.footer-to-contact-link	{margin-bottom: 20px;}
.footer-to-contact-link	a{position: relative;display: block;max-width: 500px;margin: 0 auto;padding: 10px;background: #000;color: #fff;text-decoration: none;}
.footer-to-contact-link	a:hover	{opacity: 1;background: var(--bgcolor-01)}
.footer-to-contact-link	a	i{position: absolute;top: 10px;right: 15px;transition: all 0.5s;}
.footer-to-contact-link	a:hover	i{right: 10px;}


.footer-contact-tel-list	{display:flex;flex-wrap: wrap;width: 100%;}
.footer-contact-tel-list	li{flex-basis: 50%;text-align: center;}
.footer-contact-tel-list	a{color: #000;text-decoration: none;}

@media screen and (max-width:980px){
.footer-contact-inner	{max-width: auto;margin: 0 6%;}
.footer-to-contact-link	a{max-width: 100%;width: 88%;margin: 0 6%;}
.footer-contact-tel-list	li{flex-basis: 100%;}
.footer-contact-tel-list	li:first-child{margin-bottom: 7px;}
}

@media screen and (max-width: 480px){
.footer-contact-tel-list	li	{font-size: 3.3vw;}
}


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

#footer	{background: #333;color: #fff;font-family: 'Noto Serif JP', serif;z-index: -1}
#footer,#footer	a{color: #fff;}
.footer-inner-wrap	{padding: 50px 0}

.footer-link	{margin-bottom: 50px;}

.footer-link-inner	{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;padding-bottom: 10px;border-bottom: 1px solid #666;}

.footer-link-list	{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-pack: distribute;justify-content: space-around;flex-wrap:wrap;width: 100%;}
.footer-link-list li	{flex-basis: 20%;padding: 10px 0;border-right: 1px solid #666;}
.footer-link-list li:first-child	{border-left: 1px solid #666;}

.footer-link-list	a{display: block;text-align: center;text-decoration: none}
.footer-link-list	a	span{display: block;}
.footer-link-list	a	.ja{margin-bottom: 10px;font-size: 0.9rem;}
.footer-link-list	a	.en{font-size: 0.7rem;}

.footer-info	{text-align: center}
.footer-info-name	{max-width: 400px;margin: 0 auto 40px}

.footer-info-list-wrap	{display:flex;justify-content: center;flex-wrap: wrap;margin: 0 auto 40px}

.footer-info-list	li{padding: 0.3em 0;}
.footer-info-list{padding: 0 30px;}
.footer-info-list:first-child{border-right: 1px solid #666;}
.footer-info	a{color: #fff;text-decoration: none}

.footer-place	{margin-bottom: 5px;font-size: 20px;}
.footer-adress	{line-height: 1.6em;}
.footer-telnum	{}
.footer-telnum	a{font-size: 25px;font-family: 'Roboto Condensed', sans-serif;font-weight: 400}
.footer-telnum	a:hover{opacity: 1}

.footer-pp-list-area	{display:flex;justify-content: center;align-items: center;}
.footer-pp-list	{display:flex;}
.footer-pp-list	li	{padding: 0 10px;}
.footer-pp-list	li	a{display: block;font-size: 0.7em}


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


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

.footer-link-inner	{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;padding-bottom: 10px;border-bottom: 1px solid #666;}

.footer-inner-wrap	{padding: 20px 0 50px 0;}

.footer-link	{margin-bottom: 50px}


.footer-link-list,
.footer-link-list li,
.footer-link-list li:first-child	{border: none;}

.footer-link-list	li{flex-basis: 50%;}
.footer-link	a{padding: 0.5em 0}
}

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

.footer-info-list:first-child{margin-bottom: 20px;border: none;}

}

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


.footer-link-list	{margin-bottom: 20px;justify-content: flex-start;}


.footer-info-name	{margin: 0 6% 40px}
.footer-adress	{font-size: 4vw;}

#copiright	{padding: 0 0 50px 0;font-size: 2.6vw;}

}

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

.pagetop{position: fixed;display: block;bottom: 0; right: 0;margin: 0;text-align: right;z-index: 1000;}
.pagetop    a{display: block;background: rgba(0,0,0,0.53); color: #fff;width: 40px;height: 40px;line-height: 38px;text-align: center;font-size: 180%;}
.pagetop    a:hover    {background: #2a73a1;color: #fff;}

@media screen and (max-width:768px){
.pagetop    a{width: 40px;}
.pagetop    span{display: none}
.pagetop    a   i{margin-right:0;}
}

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

/*フェードのみ*/
.fadeinonly {animation-name: fadeinfonly;animation-duration: 1s;}
@keyframes fadeinfonly{
from {opacity: 0;}
to {opacity: 1;}
}


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


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

.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);
}
}

/*ふたつめ以降のフェードの中のフェード*/
.fadein.finfade {
-moz-transition-delay: 40ms;
-webkit-transition-delay: 40ms;
-o-transition-delay: 40ms;
-ms-transition-delay: 40ms;
}

/*横から入ってくるフェード*/
.fadein-horizon {
opacity : 0;
transform : translate(100px,0px);
transition : all 1000ms;
}
.fadein-horizon.scrollin {
opacity : 1;
transform : translate(0px, 0px);
}


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

/*ふたつめ以降のフェードの中のフェード*/
.fadein-horizon.finfade {
-moz-transition-delay: 60ms;
-webkit-transition-delay: 60ms;
-o-transition-delay: 60ms;
-ms-transition-delay: 60ms;
}

.fadein-horizon.finfade2 {
-moz-transition-delay: 120ms;
-webkit-transition-delay: 120ms;
-o-transition-delay: 120ms;
-ms-transition-delay: 120ms;
}