
@charset "utf-8";
/*@import url(https://fonts.googleapis.com/css?family=Rajdhani);*/
/* CSS Document */

/*------------------------------------------
base
------------------------------------------*/
html {
	font-size: 62.5%; /*標準サイズ*/
}
html.small {
	font-size: 50%; /*小サイズ*/
}
html.big {
	font-size: 87.5%; /*大サイズ*/
}
.clearfix::after {
	content: "";
	display: block;
	clear: both;
}
:root {
	--radius: 16px;
	--padding: 16px;
	--maxwidth: 1280px;
	--width: 960px;
	--color: #393332;
	--bg: #fff;
	--att: #74d2c4;
	--gray: #fbfbfb;
}


body{
	margin: 0;
	padding: 0;
	background: var(--bg);
	color: var(--color);
	font-size: 16px;
	line-height: 200%;
}



@media all and (min-width: 1001px) {
/* PC */
	.pc{display: block !important;}
	.tablet{display: none !important;}
	.sp{display: none !important;}
}

@media all and (max-width: 1000px) and (min-width: 768px) {
/* Tablet */
	.tablet{display: block !important;}
	.sp{display: none!important;}
	.pc{display: none !important;}
}

@media all and (max-width: 767px) {
/* SP */
	.sp{display: block!important;}
	.pc{display: none !important;}
	.tablet{display: none !important;}
}


p{
    margin-bottom: 1.6rem;
}

small{
	line-height: 150%;
    font-size: 0.7rem;
}

.object-fit{
	object-fit: contain;
	font-family: 'object-fit: contain;'
}


a,a:hover,a:visited{
	color:var(--btn);
}

a{transition: 0.2s;}
a:hover{opacity: 0.5;}


.text_center{
    text-align: center;
}


img{
    image-rendering:auto;
	/*image-rendering: -webkit-optimize-contrast;*/
	vertical-align: bottom;
	max-width: 100%;
	height: auto;
	width:auto;
}

img.aspect_16_9{
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

img.aspect_1_1{
	aspect-ratio: 1 / 1;
	object-fit: cover;
}

img.aspect_4_3{
	aspect-ratio: 4 / 3;
	object-fit: cover;
}

/*------------------------------------
基本設定
------------------------------------*/
.main_width{
	width:var(--width);
	margin: 0 auto;
}
.margin_box{margin: var(--padding);}
.padding_box{padding: var(--padding);}

.link{
	position: relative;
	top: -200px;
	display: block;
}







/*----------------------------------
js-animation
------------------------------------*/

.js-animation {
	opacity: 0;
	visibility: hidden;
	transform: translateY(40px);
	transition: all 1s;
}
.js-animation.is-show {
	opacity: 1;
	visibility: visible;
	transform: translateY(0px);
}


