@charset "UTF-8";
body{
	color : var(--text);
	background-color : var(--body);
	background-image: url("../images/back.png");
	background-repeat: repeat;
}
@media screen and (max-width: 768px){
	body{
		padding-top : calc( 120 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 1000px){
	body{
		display : flex;
		align-items : flex-start;
		flex-wrap : wrap;
	}
}
body , a{
	color : var(--text);
}
/*--------------------------------------------
HEADER
---------------------------------------------*/
#header{
	background-color : #eaf1e9;
}
@media screen and (max-width: 768px){
	#header{
		position : fixed;
		top : 0;
		left : 0;
		width : 100%;
		z-index : 10;
		display : flex;
		align-items : center;
		justify-content : center;
		height : var(--logoHeightSP);
	}
	#header .logo img{
		height : var(--logoSP);
	}
	#head-banner {
		padding-top: calc( 100 * 100vw / 768 ) !important; 
		padding-bottom: calc( 50 * 100vw / 768 ) !important;
	}
}
@media print,screen and (min-width: 769px){
	#header{
		height : 100vh;
		top : 0;
		display : flex;
		flex-direction : column;
		z-index : 10;
		overflow-y : auto;
		scrollbar-width : thin;
	}
	#header::-webkit-scrollbar-track{
		background : var(--track);
	}
	#header::-webkit-scrollbar-thumb{
		background : var(--thumb);
	}
	#header::-webkit-scrollbar-thumb:hover{
		background : var(--thumbHover);
	}
	#header header{
		flex-shrink : 1;
	}
	#header .logo{
		flex-shrink : 0;
		display : flex;
		align-items : center;
		justify-content : center;
		text-align : center;
	}
	#head-banner {
		padding-top: 100px; 
	}
}
@media screen and (min-width: 769px) and (max-width:999px){
	#header{
		position : fixed;
		transform : translateX(100%);
		right : 0;
		width : calc( 200 * 100% / 768 );
		padding-left : calc( 10 * 100vw / 768 );
		padding-right : calc( 10 * 100vw / 768 );
		backface-visibility : hidden;
		will-change : transoform;
		transition : transform .3s ease-in;
	}
	#header::-webkit-scrollbar{
		width : calc( 10 * 100vw / 768 );
	}
	#header .logo{
		height : var(--logoHeightTB);
	}
	#header .logo img{
		height : var(--logoTB);
	}
}
@media print,screen and (min-width: 1000px){
	#header{
		position : -webkit-sticky;
		position :         sticky;
		top : 0;
		flex-shrink : 0;
	}
}
@media print,screen and (min-width: 1000px) and (max-width:1379px){
	#header{
		width : calc( 200 * 100% / 1280 );
		padding-left : calc( 10 * 100vw / 1280 );
		padding-right : calc( 10 * 100vw / 1280 );
	}
	#header::-webkit-scrollbar{
		width : calc( 10 * 100vw / 1280 );
	}
	#header .logo{
		height : var(--logoHeightPC);
	}
	#header .logo img{
		height : var(--logoPC);
	}
}
@media print,screen and (min-width: 1380px){
	#header{
		width : 300px;
		padding-left : 10px;
		padding-right : 10px;
	}
	#header::-webkit-scrollbar{
		width : 10px;
	}
	#header .logo{
		height : var(--logoHeightLPC);
	}
	#header .logo img{
		height : var(--logoLPC);
	}
}
@media screen and (min-width: 769px) and (max-width:999px){
	body.is-open #header{
		transform : translateX(0);
	}
}
/*--------------------------------------------
MENU BUTTON
---------------------------------------------*/
@media screen and (max-width: 768px){
	body.is-open{
		overflow : hidden;
	}
	body.is-open [data-aos^=fade]{
		opacity : 1!important;
	}
}
@media screen and (max-width: 768px){
	body.is-open #nav{
		max-height : 100vh;
	}
}
@media screen and (max-width: 768px){
	body.is-open #drawerPanel{
		position : fixed;
		z-index : -1;
		width : 100%;
	}
}
body.is-open #menuBtn > span:nth-of-type(1) span:nth-of-type(1){
	transform : translateY( calc( 10 * 100vw / 768 ) ) scale(0);
}
body.is-open #menuBtn > span:nth-of-type(1) span:nth-of-type(2){
	transform : rotate(-45deg);
}
body.is-open #menuBtn > span:nth-of-type(1) span:nth-of-type(3){
	transform : rotate(45deg);
}
body.is-open #menuBtn > span:nth-of-type(1) span:nth-of-type(4){
	transform : translateY( calc( -10 * 100vw / 768 ) ) scale(0);
}
	@media (--spIE){
		body.is-open #menuBtn > span:nth-of-type(1) span:nth-of-type(1){
			transform : translateY( 10px ) scale(0);
		}
		body.is-open #menuBtn > span:nth-of-type(1) span:nth-of-type(4){
			transform : translateY( -10px ) scale(0);
		}
	}
	#menuBtn{
		z-index : 11;
		position : fixed;
	}
	#menuBtn span{
		font-size : 0;
	}
	#menuBtn > span:nth-of-type(1){
		width : 100%;
		height : 100%;
		position : relative;
		display : block;
	}
	#menuBtn span span{
		display : block;
		position : absolute;
		left : 0;
		transition : all .4s;
		width : 100%;
	}
	#menuBtn span span:nth-of-type(1){
		top : 0;
	}
	#menuBtn span span:nth-of-type(4){
		bottom : 0;
	}

@media screen and (min-width: 769px) and (max-width:999px){
	body.is-open{
		overflow : hidden;
	}
	body.is-open [data-aos^=fade]{
		opacity : 1!important;
	}
	@media screen and (max-width: 768px){
		body.is-open #nav{
			max-height : 100vh;
		}
	}
	@media screen and (max-width: 768px){
		body.is-open #drawerPanel{
			position : fixed;
			z-index : -1;
			width : 100%;
		}
	}
	body.is-open #menuBtn > span:nth-of-type(1) span:nth-of-type(1){
		transform : translateY( calc( 10 * 100vw / 768 ) ) scale(0);
	}
	body.is-open #menuBtn > span:nth-of-type(1) span:nth-of-type(2){
		transform : rotate(-45deg);
	}
	body.is-open #menuBtn > span:nth-of-type(1) span:nth-of-type(3){
		transform : rotate(45deg);
	}
	body.is-open #menuBtn > span:nth-of-type(1) span:nth-of-type(4){
		transform : translateY( calc( -10 * 100vw / 768 ) ) scale(0);
	}
	@media (--spIE){
		body.is-open #menuBtn > span:nth-of-type(1) span:nth-of-type(1){
			transform : translateY( 10px ) scale(0);
		}
		body.is-open #menuBtn > span:nth-of-type(1) span:nth-of-type(4){
			transform : translateY( -10px ) scale(0);
		}
	}
	#menuBtn{
		z-index : 11;
		position : fixed;
	}
	#menuBtn span{
		font-size : 0;
	}
	#menuBtn > span:nth-of-type(1){
		width : 100%;
		height : 100%;
		position : relative;
		display : block;
	}
	#menuBtn span span{
		display : block;
		position : absolute;
		left : 0;
		transition : all .4s;
		width : 100%;
	}
	#menuBtn span span:nth-of-type(1){
		top : 0;
	}
	#menuBtn span span:nth-of-type(4){
		bottom : 0;
	}
}
#menuBtn{
	z-index : 11;
	position : fixed;
}
#menuBtn span{
	font-size : 0;
}
#menuBtn > span:nth-of-type(1){
	width : 100%;
	height : 100%;
	position : relative;
	display : block;
}
#menuBtn span span{
	display : block;
	position : absolute;
	left : 0;
	transition : all .4s;
	width : 100%;
}
#menuBtn span span:nth-of-type(1){
	top : 0;
}
#menuBtn span span:nth-of-type(4){
	bottom : 0;
}
@media screen and (max-width: 768px){
	#menuBtn{
		background-color : #fff;
		left : calc( 16 * 100% / 768 );
		top : calc( 20 * 100vw / 768 );
		width : calc( 84 * 100% / 768 );
		height : calc( 84 * 100vw / 768 );
		padding-top : calc( 19 * 100vw / 768 );
		padding-bottom : calc( 19 * 100vw / 768 );
		padding-left : calc( 7 * 100% / 768 );
		padding-right : calc( 7 * 100% / 768 );
	}
	#menuBtn span span{
		background : var(--menuBtn);
		height : calc( 6 * 100vw / 768 );
	}
	#menuBtn span span:nth-of-type(2) , #menuBtn span span:nth-of-type(3){
		top : calc( 20 * 100vw / 768 );
	}
}
@media screen and (min-width: 769px) and (max-width:999px){
	#menuBtn{
		position : fixed;
		background-color : #fff;
		left : calc( 16 * 100% / 768 );
		top : calc( 20 * 100vw / 768 );
		width : calc( 84 * 100% / 768 );
		height : calc( 84 * 100vw / 768 );
		padding-top : calc( 19 * 100vw / 768 );
		padding-bottom : calc( 19 * 100vw / 768 );
		padding-left : calc( 7 * 100% / 768 );
		padding-right : calc( 7 * 100% / 768 );
	}
	#menuBtn span span{
		background : var(--menuBtn);
		height : calc( 6 * 100vw / 768 );
	}
	#menuBtn span span:nth-of-type(2) , #menuBtn span span:nth-of-type(3){
		top : calc( 20 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 1000px){
	#menuBtn{
		display : none;
	}
}
/*--------------------------------------------
FIXED LINK
---------------------------------------------*/
#fixedLink{
	z-index : 11;
	position : fixed;
}
#fixedLink-2{
	z-index : 11;
	position : fixed;
}
#fixedLink span{
	font-weight : normal;
	font-size : small;
	margin-left : .5em;
}
@media screen and (max-width: 768px){
	#fixedLink{
		top : calc( 20 * 100vw / 768 );
		right : calc( 28 * 100% / 768 );
		width : 100%;
		max-width : calc( 180 * 100% / 768 );
		height : calc( 84 * 100vw / 768 );
		backface-visibility : hidden;
		will-change : max-width;
		transition : max-width .3s ease-in;
	}
	#fixedLink-2{
		display: none;
	}
}
@media screen and (min-width: 769px) and (max-width:999px){
	#fixedLink{
		top : calc( 10 * 100vw / 768 );
		right : calc( 14 * 100% / 768 );
		width : calc( 234 * 100% / 768 );
		height : calc( 50 * 100vw / 768 );
		backface-visibility : hidden;
		will-change : right;
		transition : right .3s ease-in;
	}
	#fixedLink-2{
		display: none;
	}
}
@media print,screen and (min-width: 1000px) and (max-width:1379px){
	#fixedLink{
		top : calc( 10 * 100vw / 1280 );
		right : calc( 14 * 100% / 1280 );
		width : calc( 234 * 100% / 1280 );
		height : calc( 50 * 100vw / 1280 );
	}
	#fixedLink-2{
		top : calc( 10 * 100vw / 1280 );
		right : calc( ( 234 * 100% / 1280 ) + (14 * 100% / 1280 ) + (10 * 100% / 1280 ));
		width : calc( 234 * 100% / 1280 );
		height : calc( 50 * 100vw / 1280 );
	}
}
@media print,screen and (min-width: 1380px){
	#fixedLink{
		top : 10px;
		right : 14px;
		width : 234px;
		height : 50px;
	}
	#fixedLink-2{
		top : 10px;
		right : calc(234px + 14px + 10px);
		width : 234px;
		height : 50px;
	}
}
@media screen and (max-width: 768px){
	body.is-open #fixedLink{
		max-width : calc( 300 * 100% / 768 );
		height : calc( 84 * 100vw / 768 );
	}
	body.is-open #fixedLink br{
		display : none;
	}
}
@media screen and (min-width: 769px) and (max-width:999px){
	body.is-open #fixedLink{
		right : calc( 214 * 100% / 768 );
	}
}
/*--------------------------------------------
NAV
---------------------------------------------*/
@media screen and (max-width: 768px){
	#nav{
		position : fixed;
		left : 0;
		width : 100%;
		z-index : 10;
		transition : max-height .5s ease-in;
		max-height : 0;
		overflow : hidden;
		overflow-y : scroll;
		background-color : var(--drawer);
		height : 100vh;
		top : 0;
		color : #fff;
	}
	#nav a{
		color : #fff;
	}
	#nav .scroll{
		padding-left : calc( 34 * 100% / 768 );
		padding-right : calc( 34 * 100% / 768 );
		padding-top : calc( 150 * 100vw / 768 );
		padding-bottom : calc( 58 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 769px){
	#nav{
		flex-grow : 1;
	}
	#nav .scroll{
		display : flex;
		flex-direction : column;
		height : 100%;
		width : 100%;
	}
}
@media screen and (min-width: 769px) and (max-width:999px){
	#nav{
		padding-bottom : calc( 16 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 1000px) and (max-width:1379px){
	#nav{
		padding-bottom : calc( 16 * 100vw / 1280 );
		height : calc( 100vh - var(--logoHeightPC) );
	}
}
@media print,screen and (min-width: 1380px){
	#nav{
		padding-bottom : 16px;
		height : calc( 100vh - var(--logoHeightLPC) );
	}
}
/*--------------------------------------------
NAV TEL
---------------------------------------------*/
#nav-tel{
	display : none;
}
@media screen and (max-width: 768px){
	#nav-tel{
		position : fixed;
		top : calc( 20 * 100vw / 768 );
		width : calc( 200 * 100% / 768 );
		height : calc( 84 * 100vw / 768 );
		left : calc( 232 * 100% / 768 );
		backface-visibility : hidden;
		will-change : display;
	}
}
@media screen and (max-width: 768px){
	body.is-open #nav-tel{
		display : flex;
	}
}
/*--------------------------------------------
NAV GLOBAL
---------------------------------------------*/
#nav-global a{
	display : block;
}
@media screen and (max-width: 768px){
	#nav-global a{
		letter-spacing : .1em;
		padding-top : calc( 17 * 100vw / 768 );
		padding-bottom : calc( 17 * 100vw / 768 );
		padding-left : calc( 20 * 100vw / 768 );
		padding-right : calc( 20 * 100vw / 768 );
		font-size : calc( 26 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 769px){
	#nav-global{
		border-top : 1px solid var(--border);
		flex-grow : 1;
		overflow-y : auto;
		scrollbar-width : thin;
	}
	#nav-global::-webkit-scrollbar-track{
		background : var(--track);
	}
	#nav-global::-webkit-scrollbar-thumb{
		background : var(--thumb);
	}
	#nav-global::-webkit-scrollbar-thumb:hover{
		background : var(--thumbHover);
	}
	#nav-global a{
		letter-spacing : .2em;
	}
}
@media screen and (min-width: 769px) and (max-width:999px){
	#nav-global{
		padding-top : calc( 20 * 100vw / 768 );
		padding-bottom : calc( 20 * 100vw / 768 );
	}
	#nav-global::-webkit-scrollbar{
		width : calc( 10 * 100vw / 768 );
	}
	#nav-global li + li{
		margin-top : calc( 20 * 100vw / 768 );
	}
	#nav-global a{
		font-size : calc( 14 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 1000px) and (max-width:1379px){
	#nav-global{
		padding-top : calc( 20 * 100vw / 1280 );
		padding-bottom : calc( 20 * 100vw / 1280 );
	}
	#nav-global::-webkit-scrollbar{
		width : calc( 10 * 100vw / 1280 );
	}
	#nav-global li + li{
		margin-top : calc( 20 * 100vw / 1280 );
	}
	#nav-global a{
		font-size : calc( 14 * 100vw / 1280 );
	}
}
@media print,screen and (min-width: 1380px){
	#nav-global{
		padding-top : 20px;
		padding-bottom : 20px;
	}
	#nav-global::-webkit-scrollbar{
		width : 10px;
	}
	#nav-global li + li{
		margin-top : 20px;
	}
	#nav-global a{
		font-size : 14px;
		padding-left : 13px;
		padding-right : 13px;
	}
}
/*--------------------------------------------
NAV ABOUT
---------------------------------------------*/
#nav-about .flex{
	display : flex;
}
#nav-about h1{
	margin-bottom : .8em;
}
#nav-about h1 span{
	margin-left : .5em;
	font-size : smaller;
}
#nav-about dt{
	color: var(--bg);
}
@media screen and (max-width: 768px){
	#nav-about{
		margin-top : calc( 74 * 100vw / 768 );
		border-top : calc( 3 * 100vw / 768 ) solid #fff;
		padding-top : calc( ( 53 - 7 ) * 100vw / 768 );
		padding-left : calc( 20 * 100vw / 768 );
		padding-right : calc( 20 * 100vw / 768 );
	}
	#nav-about > div + div{
		margin-top : calc( 40 * 100vw / 768 );
	}
	#nav-about dt , #nav-about dd{
		font-size : calc( 26 * 100vw / 768 );
		line-height : 1.54;
		letter-spacing : .1em;
	}
	#nav-about dt{
		color: #ccc;
	}
}
@media print,screen and (min-width: 769px){
	#nav-about{
		flex-shrink : 0;
		border-top : 1px solid var(--border);
	}
	#nav-about div.mini{
		display: flex;
		column-gap: 1em;
	}
	#nav-about dt , #nav-about dd{
		line-height : 1.43;
	}
	#nav-about dt{
		min-width: 4em;
	}
}
@media screen and (min-width: 769px) and (max-width:999px){
	#nav-about{
		padding-top : calc( ( 15 - 3 ) * 100vw / 768 );
	}
	#nav-about > div + div{
		margin-top : calc( 5 * 100vw / 768 );
	}
	#nav-about dt , #nav-about dd{
		font-size : calc( 12 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 1000px) and (max-width:1379px){
	#nav-about{
		padding-top : calc( ( 15 - 3 ) * 100vw / 1280 );
	}
	#nav-about > div + div{
		margin-top : calc( 5 * 100vw / 1280 );
	}
	#nav-about dt , #nav-about dd{
		font-size : 13px;
	}
}
@media print,screen and (min-width: 1380px){
	#nav-about{
		padding-top : calc( 18px - 3px );
		padding-left : 13px;
		padding-right : 13px;
	}
	#nav-about > div + div{
		margin-top : calc( 15px - 3px );
	}
	#nav-about dt , #nav-about dd{
		font-size : 14px;
	}
}
/*--------------------------------------------
NAV CONTACTS
---------------------------------------------*/
#nav-contacts .link01{
	flex-wrap : wrap;
	display : flex;
}
#nav-contacts .link01 span{
	display : block;
	text-align : center;
	width : 100%;
	padding : 0;
	font-size : small;
	font-weight : normal;
	line-height : 1.5;
}
@media print,screen and (min-width: 769px){
	#nav-contacts{
		flex-shrink : 0;
	}
	#nav-contacts .link01{
		width : 100%;
	}
}
@media screen and (max-width: 768px){
	#nav-contacts{
		padding-left : calc( 20 * 100% / 768 );
		padding-right : calc( 20 * 100% / 768 );
		margin-top : calc( ( 70 - 7 ) * 100vw / 768 );
	}
	#nav-contacts .tel{
		display : flex;
		align-items : center;
		justify-content : center;
		text-align : center;
		width : 100%;
		height : calc( 134 * 100vw / 768 );
		letter-spacing : .1em;
		border : calc( 3 * 100vw / 768 ) solid #fff;
		font-size : calc( 50 * 100vw / 768 );
	}
	#nav-contacts .link01{
		font-size : calc( 32 * 100vw / 768 );
		letter-spacing : .1em;
		margin-top : calc( 20 * 100vw / 768 );
		padding : calc( 20 * 100vw / 768 );
	}
	#nav-contacts .tablecheck{
		position: relative;
		margin-top: calc( 10 * 100vw / 768 );
	}
}
@media screen and (min-width: 769px) and (max-width:999px){
	#nav-contacts{
		padding-top : calc( ( 13 - 3 ) * 100vw / 768 );
	}
	#nav-contacts .tel{
		font-size : calc( 14 * 100vw / 768 );
	}
	#nav-contacts .link01{
		margin-top : calc( 13 * 100vw / 768 );
		padding : calc( 5 * 100vw / 768 );
		line-height : 1;
	}
	#nav-contacts .tablecheck{
		margin-top: -10px;
		position: relative;
	}
}
@media print,screen and (min-width: 1000px) and (max-width:1379px){
	#nav-contacts{
		padding-top : calc( ( 13 - 3 ) * 100vw / 1280 );
	}
	#nav-contacts .tel{
		font-size : calc( 14 * 100vw / 1280 );
	}
	#nav-contacts .link01{
		margin-top : calc( 13 * 100vw / 1280 );
		padding : 10px 0;
	}
	#nav-contacts .tablecheck{
		margin-top: -10px;
		position: relative;
	}
}
@media print,screen and (min-width: 1380px){
	#nav-contacts{
		padding-top : calc( 18px - 3px );
	}
	#nav-contacts .tel{
		font-size : 22px;
		padding-left : 13px;
		padding-right : 13px;
	}
	#nav-contacts .link01{
		margin-top : 20px;
		padding : 15px 0;
	}
	#nav-contacts .tablecheck{
		position: relative;
		margin-top: -10px;
	}
}
/*--------------------------------------------
NAV SNS
---------------------------------------------*/
#nav-sns{
	display : flex;
	flex-wrap : wrap;
	justify-content : center;
	align-items : center;
}
@media screen and (max-width: 768px){
	#nav-sns{
		margin-top : calc( 36 * 100vw / 768 );
	}
	#nav-sns li + li{
		margin-left : calc( 25 * 100% / 768 );
	}
	#nav-sns img{
		height : calc( 100 * 100vw / 768 );
	}
}
@media screen and (min-width: 769px) and (max-width:999px){
	#nav-sns{
		padding-top : calc( 7 * 100vw / 768 );
	}
	#nav-sns li + li{
		margin-left : calc( 5 * 100vw / 768 );
	}
	#nav-sns img{
		height : calc( 30 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 1000px) and (max-width:1379px){
	#nav-sns{
		padding-top : calc( 7 * 100vw / 1280 );
	}
	#nav-sns li + li{
		margin-left : calc( 5 * 100vw / 1280 );
	}
	#nav-sns img{
		height : calc( 30 * 100vw / 1280 );
	}
}
@media print,screen and (min-width: 1380px){
	#nav-sns{
		padding-top : 18px;
	}
	#nav-sns li + li{
		margin-left : 10px;
	}
	#nav-sns img{
		height : 40px;
	}
}
/*--------------------------------------------
CLOSE BUTTON
---------------------------------------------*/
@media screen and (max-width: 768px){
	#closeBtn{
		text-align : center;
		width : calc( 82 * 100% / 700 );
		margin-top : calc( 72 * 100vw / 768 );
		margin-left : auto;
		margin-right : auto;
		display : block;
	}
	#closeBtn img{
		width : 100%;
		height : auto;
	}
}
/*--------------------------------------------
MAIN
---------------------------------------------*/
@media screen and (max-width: 768px){
	#main .wrap{
		padding-left : calc( 16 * 100% / 768 );
		padding-right : calc( 16 * 100% / 768 );
	}
	#main .wrap , #main .wrap-fluid{
		padding-top : calc( 200 * 100vw / 768 );
	}
	#information .wrap{
		padding-top : calc( 80 * 100vw / 768 );
	}
	#gallery.wrap-fluid{
		padding-top : calc( 60 * 100vw / 768 );
	}
}
@media screen and (min-width: 769px) and (max-width:999px){
	#main .wrap{
		padding-left : calc( 14 * 100% / 768 );
		padding-right : calc( 14 * 100% / 768 );
	}
	#main .wrap , #main .wrap-fluid{
		padding-top : calc( 68 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 1000px){
	#main{
		flex-shrink : 0;
	}
	#main .wrap{
		max-width : 1200px;
		margin-left : auto;
		margin-right : auto;
		padding-left: 20px;
		padding-right: 20px;
	}
	#main .wrap-inner{
		max-width : 1200px;
		margin-left : auto;
		margin-right : auto;
		padding-left: 20px;
		padding-right: 20px;
	}
}
@media print,screen and (min-width: 1000px) and (max-width:1379px){
	#main{
		width : calc( 100% - ( 200 * 100% / 1280 ) );
	}
	#main .wrap , #main .wrap-fluid{
		padding-top : calc( 100 * 100vw / 1280 );
	}
}
@media print,screen and (min-width: 1380px){
	#main{
		width : calc( 100% - 300px );
	}
	#main .wrap , #main .wrap-fluid{
		padding-top : 200px;
	}
}
/*--------------------------------------------
FOOTER
---------------------------------------------*/
#footer{
	background-color : var(--footerbg);
	color : #fff;
}
#footer .copyright{
	line-height : 1.2;
	letter-spacing : .1em;
}
@media screen and (max-width: 768px){
	#footer .wrap{
		padding-top : calc( ( 42 - 2 ) * 100vw / 768 );
		padding-bottom : calc( ( 90 - 2 ) * 100vw / 768 );
		text-align : center;
	}
	#footer .copyright{
		font-size : calc( 20 * 100vw / 768 );
	}
}
@media screen and (min-width: 769px) and (max-width:999px){
	#footer .wrap{
		padding-top : calc( 50 * 100vw / 768 );
		padding-bottom : calc( 50 * 100vw / 768 );
		text-align : center;
	}
	#footer .logo img{
		height : calc( 32 * 100vw / 768 );
	}
	#footer .copyright{
		font-size : calc( 13 * 100vw / 768 );
		margin-top : calc( ( 36 * 100vw / 768 ) - .1em );
	}
}
@media print,screen and (min-width: 1000px){
	#footer{
		width : 100%;
	}
	#footer .wrap{
		text-align : right;
	}
}
@media print,screen and (min-width: 1000px) and (max-width:1379px){
	#footer .wrap{
		padding-left : calc( 30 * 100% / 1280 );
		padding-right : calc( 30 * 100% / 1280 );
		padding-top : calc( 50 * 100vw / 1280 );
		padding-bottom : calc( 50 * 100vw / 1280 );
	}
	#footer .logo img{
		height : calc( 32 * 100vw / 1280 );
	}
	#footer .copyright{
		font-size : calc( 13 * 100vw / 1280 );
		margin-top : calc( ( 36 * 100vw / 1280 ) - .1em );
	}
}
@media print,screen and (min-width: 1380px){
	#footer .wrap{
		padding-left : 30px;
		padding-right : 30px;
		padding-top : 50px;
		padding-bottom : 50px;
	}
	#footer .logo img{
		height : 32px;
	}
	#footer .copyright{
		font-size : 13px;
		margin-top : calc( 36px - .1em );
	}
}


.slant-bg {
    width: 100%;
    margin: 0;
    position: relative;
}

.slant-bg::before {
    content: '';
    position: absolute;
    top: 50px;
    bottom: 100px;
    left: 0;
    right: 0;
    background-color: rgba(81,116,1,.05);
    transform: skewY(-7deg);
    z-index: -1;
}

.contents-page .slant-bg-first{
    width: 100%;
    margin: 0;
    position: relative;
}

.contents-page .slant-bg-first::before {
    content: '';
    position: absolute;
    top: -100px;
    bottom: -150px;
    left: 0;
    right: 0;
    background-color: rgba(81,116,1,.05);
    transform: skewY(-7deg);
    z-index: -1;
}
@media screen and (max-width: 768px){
	.contents-page .slant-bg-first::before {
		content: '';
		position: absolute;
		top: -100px;
		bottom: -50px;
		left: 0;
		right: 0;
		background-color: rgba(81,116,1,.05);
		transform: skewY(-7deg);
		z-index: -1;
	}
}

#thanks .wrap {
	text-align: center;
	padding: 100px 2em;
	
}
@media screen and (max-width: 768px){
	.st-view {
		margin-top: calc( 32 * 100vw / 768 );
	}
	.st-view iframe {
		width: calc( 736 * 100vw / 768 );
		height: calc( 550 * 100vw / 768 );
	}
}
@media print,screen and (min-width: 769px){
	.st-view iframe {
		width: 520px;
		height: 350px;
	}
}