@charset "UTF-8";


*{
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
.hero{
	margin-bottom: 100px;
	height: 100vh;
}
.main{
	margin: 0 auto 100px;
	width: 80%;
}



body{
	color: #999;
	font-size:14px;
	font-family: 'Noto Sans Japanese', sans-serif;;
	line-height: 2;
}

a{
	color: #999;
	transition: .5s;
}

a:hover{
	opacity: 0.8;
}


ol,ul,li{
	list-style: none;
}


.box{
	margin-bottom: 120px;
	overflow: hidden;
	position: relative;
}

.box__centered{
	position:fixed; top:10px; left:40px;
}



/*スクロールバーを非表示*/
.container {
        height: 150px;
        overflow-y: scroll;
        -ms-overflow-style: none;    /* IE, Edge 対応 */
        scrollbar-width: none;       /* Firefox 対応 */
    }
    .container::-webkit-scrollbar {  /* Chrome, Safari 対応 */
        display:none;
    }
/*スクロールバーを非表示*/

/*スクロールバーを非表示*/
html, body{
  overflow: hidden;
}
/*スクロールバーを非表示*/



h1 { color:#ffffff; font:normal 38px 'Comfortaa', arial; letter-spacing:1px;padding-bottom:0px; height:45px; }
h2 { color:#434343; font:normal 38px 'Comfortaa', arial; letter-spacing:1px;padding-bottom:0px; height:45px; }
h3 { color:#ffffff; font:normal 18px 'Comfortaa', arial; letter-spacing:1px;padding-bottom:0px; height:20px; }
h4 { color:#ffffff; font:normal 10px 'Comfortaa', arial; letter-spacing:1px;padding-bottom:25px; height:15px; }
h5 { color:#434343; font:normal 12px 'Comfortaa', arial; letter-spacing:0.5px;padding-bottom:0px; height:35px; }

.ord_text { color:#ffffff; font:normal 14px 'Comfortaa', arial; line-height:30px; letter-spacing:1px;padding-bottom:0px; height:45px; }

.black-50 { background: url(../images/black-50-trans.png); color: #fff; padding: 20px 25px; margin: 30px 0; }
.black-65 { background: url(../images/black-65-trans.png); color: #fff; padding: 4px 12px; margin: 24px 0; }

a.over:hover img {
	opacity:0.6;filter:alpha(opacity=80);-ms-filter: "alpha( opacity=80 )";
}


.switch3 {
  position: fixed;  /* 固定配置 */
  bottom: 0px;     /* 画面下から0pxの位置に配置 */
  right: 20px;      /* 画面右から20pxの位置に配置 */
  z-index: 1000;    /* 他の要素の上に表示するためにz-indexを指定 */
}



/*** Android ボタン ***/
.switch3__label {
	width: 37px;
	position: relative;
	display: inline-block;
	padding-top: 3px;
}
.switch3__content {
	display: block;
  cursor: pointer;
  position: relative;
  border-radius: 7px;
  height: 14px;
  background-color: rgba(34,31,31,.26);
  -webkit-transition: all .1s .4s;
	   -moz-transition: all .1s .4s;
	    -ms-transition: all .1s .4s;
	     -o-transition: all .1s .4s;
	        transition: all .1s .4s;
	overflow: hidden;
}
 
.switch3__content:after {
	content: "";
	display: block;
	position: absolute;
	
	width: 0;
	height: 100%;
	top: 0;
	left: 0;
	
	border-radius: 7px;
	-webkit-transition: all .5s;
	   -moz-transition: all .5s;
	    -ms-transition: all .5s;
	     -o-transition: all .5s;
	        transition: all .5s;
}
.switch3__input {
	display: none;
}
.switch3__circle {
	display: block;
	top: 0px;
	left: 0px;
	position: absolute;
	width: 20px;
	height: 20px;
	-webkit-border-radius: 10px;
	        border-radius: 10px;
	background-color: #fdf0c4;
	-webkit-transition: all .5s;
	   -moz-transition: all .5s;
	    -ms-transition: all .5s;
	     -o-transition: all .5s;
	        transition: all .5s;
	-webkit-box-shadow: 0 2px 2px #ccc;
	        box-shadow: 0 2px 2px #ccc;
}
.switch3__input:checked ~ .switch3__circle {
	left: 18px;
	background-color: #f7a992;
}
.switch3__input:checked ~ .switch3__content {
 
	border-color: transparent;
	-webkit-transition: all 0s;
	   -moz-transition: all 0s;
	    -ms-transition: all 0s;
	     -o-transition: all 0s;
	        transition: all 0s;
}
 
.switch3__input:checked ~ .switch3__content:after {
	background-color: rgba(255,255,255,0.7);
	width: 100%;
}
/*** Android ボタン ***/


#copyright{
	position:absolute;
	top: 100%;
	left: 50px;
	margin-top: -55px;
	z-index: 1000;
	
}

p.copyright_text {
	
	color:#ffffff;
	font-size:14px;
	
}



a.copyright_link{
	outline: 0;
	color:#dedcda;
	text-decoration: none;
	
	
}

a.copyright_link:hover {
	outline: 0;
	color:#ffffff;
	text-decoration: none;

}




/*メニュー*/
/*transition & delay*/
.transition10{transition:all 1s cubic-bezier(0.190, 1.000, 0.220, 1.000);}
.delay01{transition-delay: .1s;}
.delay02{transition-delay: .2s;}
.delay03{transition-delay: .3s;}
.delay04{transition-delay: .4s;}
.delay05{transition-delay: .5s;}
.delay06{transition-delay: .6s;}
.delay07{transition-delay: .7s;}
.delay08{transition-delay: .8s;}
.delay09{transition-delay: .9s;}
.delay10{transition-delay: 1s;}
.delay11{transition-delay: 1.1s;}
.delay12{transition-delay: 1.2s;}
.delay13{transition-delay: 1.3s;}
.delay14{transition-delay: 1.4s;}
/*menu*/
.menu{
    position: fixed;
    left: 20px;
    top: 20px;
    z-index: 99;
}
.menu__line{
    background: #fff;
    display: block;
    height: 2px;
    position: absolute;
    transition:transform .3s;
    width: 100%;
}
.menu__line--center{
    top: 9px;
}
.menu__line--bottom{
    bottom: 0;
}
.on .menu__line--top{
    top: 8px;
    transform: rotate(45deg);
}
.on .menu__line--center{
    transform:scaleX(0);
}
.on .menu__line--bottom{
    bottom: 10px;
    transform: rotate(135deg);
}
.menu__circle-base{
	left: -10px;
	position: absolute;
	top: -14px;
	transform: rotate(-90deg);
}
.menu__circle{
	opacity: 0;
	stroke-dasharray: 0 144;
	transition: 0.5s;	
}
.menu:hover .menu__circle{
	opacity: 1;
	stroke-dasharray: 144 144;
}
/*fullnav*/
.fullnav{
	display: none;
	height: 100%;
	left: 0;
	position: fixed;
	top: 0;
	width: 100%;	
}
/*fullnav__nav*/
.fullnav__nav{
	align-items: center;
	background: #fff;
	display: flex;
	height: 100%;
	left: 0;
	opacity: 0;
	position: absolute;
	top: 0;
	width: 0;
}
/*gnav*/
.gnav{
	margin: 0 auto;
	width: 40%;
}
.gnav__menu__item{
	margin:1px 0;
	opacity: 0;
	transform: translateY(100px);
}
.gnav a{
	color: #333;
	text-decoration: none;
}
/*fullnav__cnt*/
.fullnav__cnt{
	align-items: center;
	background: #4c364d;
	color: #fff;
	display: flex;
	height: 100%;
	left: 30%;
	opacity: 0;
	position: absolute;
	top: 0;
	width: 0;
    overflow-y: scroll;
}
.fullnav__cnt__inner{
	margin: 0 auto;
	width: 80%;
}
.fullnav__cnt__title{
	margin-bottom: 20px;
	opacity: 0;
	transform: translateY(100px);
}
.fullnav__cnt__menu{
	list-style: none;
}
.fullnav__cnt__menu__item{
	margin:0px 0;
	opacity: 0;
	transform: translateY(100px);
}
.fullnav__cnt__menu__item a{
	color: #fff;
}
/*on fullnav__nav*/
.fullnav.on .fullnav__nav{
	opacity: 1;
	width: 30%;
}
/*on gnav*/
.fullnav.on .gnav li{
	opacity: 1;
	transform: translateY(0);	
}
/*on fullnav__cnt*/
.fullnav.on .fullnav__cnt{
	opacity: 1;
	width: 70%;
}
.fullnav.on .fullnav__cnt__title{
	opacity: 1;
	transform: translateY(0);
}
.fullnav.on .fullnav__cnt__menu__item{
	opacity: 1;
	transform: translateY(0);
}
/*メニュー*/