/* CSS Document */

.pcOnly{display: none !important;}

/*====== Container Box =====*/
.main_container{
	width: 94%;
    margin: 0 auto;
    position: relative;
    height: fit-content;
    height: -ms-fit-content;
    height: -moz-fit-content;
    height: -webkit-fit-content;
    height: -o-fit-content;
    overflow: hidden;
}

.main_box{width: 100%;}

p.paragraph{
	display: block; font-size: 14px; line-height: 24px; margin-bottom: 20px;
	opacity: .4; -webkit-opacity:.4;
}


/*====== グロナビ =====*/
.glonav{
	display: flex; align-items: center;
	height: fit-content; height: -ms-fit-content; height: -moz-fit-content; height: -webkit-fit-content; height: -o-fit-content;
	width: fit-content; width: -ms-fit-content; width: -moz-fit-content; width: -webkit-fit-content; width: -o-fit-content;
}
.glonav a.glonavLink{
	display: block; float: left; font-family: 'Montserrat', sans-serif; font-size: 14px; margin-right: 30px;
	height: fit-content; height: -ms-fit-content; height: -moz-fit-content; height: -webkit-fit-content; height: -o-fit-content;
	width: fit-content; width: -ms-fit-content; width: -moz-fit-content; width: -webkit-fit-content; width: -o-fit-content;
}
.glonav a.instagram{display: block; float: left; width: 24px; height: 24px;}


/*======ヘッダー =====*/

header{width: 100%; position: relative; overflow: hidden;}
#header{
	display: block; width: 94%; z-index: 6; position: relative; margin: 0 auto; overflow: hidden;
	height: fit-content; height: -ms-fit-content; height: -moz-fit-content; height: -webkit-fit-content; height: -o-fit-content;
}
#header a.logo{
	display: block;
    width: 190px;
    height: 30px;
    margin: 30px auto 0;
}
#header .glonav{margin: 20px auto 0;}


/*====== フッター =====*/
footer{    
	width: 100%;
    height: 360px;
    position: relative;}
footer .btnBlog{
	width: 80%;
    height: 70px;
    background-color: #2e2929;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
}
footer .btnBlog span{
	display:block; position: absolute; left: 10%; top: 0; bottom: 0; margin: auto;
	font-family: 'Cormorant Infant', serif; font-size: 40px; text-transform: uppercase;
	height: fit-content; height: -ms-fit-content; height: -moz-fit-content; height: -webkit-fit-content; height: -o-fit-content;
	width: fit-content; width: -ms-fit-content; width: -moz-fit-content; width: -webkit-fit-content; width: -o-fit-content;
}
footer .btnBlog div{
	display: block; position: absolute; right: 30px; top: 0; bottom: 0; margin: auto;
    width: 20px; height: 20px;
}
footer .btnBlog div path:nth-of-type(1){
	display: block;
    position: absolute;
    right: 0;
    width: 17px;
    height: 17px;
	background: transparent;
    border-top: 1px solid #fff;
    border-right: 1px solid #fff;
}
footer .btnBlog div path:nth-of-type(2){
    display: block;
    position: absolute;
    width: 27px;
    height: 1px;
    top: 10px;
    left: -4px;
    background: #fff;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
}

#footer{width: 100%; height: 320px; position: absolute; bottom: 0; left: 0; background-color: #1f1b1b;}
.footer_main{
	width: 94%; position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto;
	height: fit-content; height: -ms-fit-content; height: -moz-fit-content; height: -webkit-fit-content; height: -o-fit-content;
}

.footer_main a.logo{display: block; width: 253px; height: 40px; margin: 20px 0;}

.footer_main .copyright{
	margin-top: 20px; font-family: 'Montserrat', sans-serif;
	font-size: 12px; opacity: .4; -webkit-opacity:.4;
}




/*====== アニメーション =====*/
.anmt_delay2{transition: all .8s ease-in .2s !important;}
.anmt_delay4{transition: all .8s ease-in .4s !important;}
.anmt_delay6{transition: all .8s ease-in .6s !important;}
.anmt_delay8{transition: all .8s ease-in .8s !important;}
.anmt_delay10{transition: all .8s ease-in 1.0s !important;}
.anmt_delay12{transition: all .8s ease-in 1.2s !important;}
.anmt_delay14{transition: all .8s ease-in 1.4s !important;}
.tranNone{transition: all 0s ease-in 0s !important;}

.anmt_opacity0, .anmt_opacity0_2, .anmt_opacity0_3{ /* 左から右に動くelement */
	-webkit-opacity: 0; opacity: 0;
}

.anmt_opacity1{ /* 左から右に動くelement */
	-webkit-opacity: 1 !important; opacity: 1 !important;
	transition: all .8s ease-in;
}

.anmt_opacity1_2{ /* 左から右に動くelement */
	-webkit-opacity: .1 !important; opacity: .1 !important;
	transition: all .8s ease-in;
}

.anmt_opacity1_3{ /* 左から右に動くelement */
	-webkit-opacity: .2 !important; opacity: .2 !important;
	transition: all .8s ease-in;
}

.anmt_l2rScale{
	-webkit-opacity: 0; opacity: 0;
	-webkit-transform:translateX(-100%) scale(-1);
	transform:translateX(-100%) scale(-1);	
}

.anmt_l2rScale_trsfrm{
	-webkit-opacity: 1 !important; opacity: 1 !important;
	-webkit-transform:translateX(0) scale(-1) !important;
	transform:translateX(0) scale(-1) !important;	
	transition: all .8s ease-in;
}

.anmt_r2lScale{
	-webkit-opacity: 0; opacity: 0;
	-webkit-transform:translateX(100%) scale(1);
	transform:translateX(100%) scale(1);	
}

.anmt_r2lScale_trsfrm{
	-webkit-opacity: 1 !important; opacity: 1 !important;
	-webkit-transform:translateX(0) scale(1) !important;
	transform:translateX(0) scale(1) !important;	
	transition: all .8s ease-in;
}

.anmt_l2r, .anmt_l2r_opa{ /* 左から右に動くelement */
	-webkit-opacity: 0; opacity: 0;
	-webkit-transform:translateX(-100%);
	transform:translateX(-100%);	
}

.anmt_r2l{ /* 右から左に動くelement */
	-webkit-opacity: 0; opacity: 0;
	-webkit-transform:translateX(100%);
	transform:translateX(100%);	
}

.anmt_l2r2l_trsfrm{ /* 左右に動くアニメーション */
	-webkit-opacity: 1 !important; opacity: 1 !important;
	-webkit-transform:translateX(0) !important;
	transform:translateX(0) !important;
	transition: all .8s ease-in;
}

.anmt_l2r_opa_trnsfrm{
	-webkit-opacity: .2 !important; opacity: .2 !important;
	-webkit-transform:translateX(0) !important;
	transform:translateX(0) !important;
	transition: all .8s ease-in;
}

.anmt_t2b, .anmt_menu{ /* 上から下に動くelement */
	-webkit-opacity: 0; opacity: 0;
	-webkit-transform:translateY(-200px);
	transform:translateY(-200px);	
}

.anmt_b2t{ /* 下から上に動くelement */
	-webkit-opacity: 0; opacity: 0;
	-webkit-transform:translateY(200px);
	transform:translateY(200px);	
}

.anmt_t2b2t_trsfrm{ /* 上下に動くアニメーション */
	-webkit-opacity: 1 !important; opacity: 1 !important;
	-webkit-transform:translateY(0) !important;
	transform:translateY(0) !important;
	transition: all .8s ease-in;
}

.anmt_lb2rt{ /* 左下から右上に動くelement */
	-webkit-opacity: 0; opacity: 0;
	-webkit-transform:translate(-250px,150px);
	transform:translate(-250px,150px);	
}

.anmt_rb2lt{ /* 右下から左上に動くelement */
	-webkit-opacity: 0; opacity: 0;
	-webkit-transform:translate(200px,100px);
	transform:translate(200px,100px);	
}

.anmt_lt2rb{ /* 左上から右下に動くelement */
	-webkit-opacity: 0; opacity: 0;
	-webkit-transform:translate(-250px,100px);
	transform:translate(-250px,100px);	
}

.anmt_rt2lb{ /* 右上から左下に動くelement */
	-webkit-opacity: 0; opacity: 0;
	-webkit-transform:translate(250px,-100px);
	transform:translate(250px,-100px);	
}

.anmt_angle_trnsfrm, .logo_trnsfrm{ /* 上下左右に動くアニメーション */ /* ロゴを動かさない場合は.logo_trnsfrmを外す */
	-webkit-opacity: 1 !important; opacity: 1 !important;
	-webkit-transform:translate(0px,0px) !important;
	transform:translate(0px,0px) !important;
	transition: all .8s ease-in;
}







