@charset "UTF-8";


/*
===================================================================

CONTENTS

	1: IMPORT
		1-1: RESET
		1-2: NAV
	2: BODY AND BASE SETTING
		2-1: HTML + BODY
		2-2: GENERAL SETTING
		2-3: FONT SIZE & STYLE
		2-4: CONTAINER
		2-5: SLIDER - bxslider
		2-6: thumbnail_box / thumbnail_list_box
		2-7: BG-COLOR
		2-8: ScrollTrigger
	3: STYLE
		3-1: styles
		
===================================================================
*/


/*
====================================================
1: IMPORT
====================================================
*/
@import url(sanitize.css);
@import url(nav.css);


/* --------------------------------------------------------------------------------------------
2: HTML + BODY
-------------------------------------------------------------------------------------------- */
html { font-size: 62.5%; }
body { 
	font-size: 1.8rem;
/*	line-height: 2.25;*/
	line-height: 1.8;
	background:#000 ;
	color: #fff;
	letter-spacing: .075em;
 }

img{
	width: 100%;
}

ul {margin:0;padding: 0;}
li {list-style:none}

h1,h2,h3,h4,p{
	margin: 0 0 1rem;
	font-weight: normal;
}


@media screen and (max-width: 768px) {
	.pc{
		display: none;
	}
}
@media screen and (min-width: 768px) {
	.sp{
		display: none;
	}
}

a{
	text-decoration: none;
	/*transition: 0.3s linear;*/
	color: #333;
}
a:hover{
	opacity:0.8;
}




body {
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 400;
  font-style: normal;
}





@media screen and (min-width: 768px) {
	.container-in.contact .tel-no a[href^="tel:"] {
	    pointer-events: none;
	}
}

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

}





/* --------------------------------------------------------------------------------------------
	LoadingのためのCSS
-------------------------------------------------------------------------------------------- */



/* Loading背景画面設定　*/
#splash {
    /*fixedで全面に固定*/
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 999;
	background:#000;
	text-align:center;
	color:#fff;
}

/* Loading画像中央配置　*/
#splash_logo {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

/* Loading アイコンの大きさ設定　*/
#splash_logo img {
	width:70%;
}

/* fadeUpをするアイコンの動き */

.fadeUp{
animation-name: fadeUpAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity: 0;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
	transform: translateY(100px);
  }

  to {
    opacity: 1;
	transform: translateY(0);
  }
}







/* --------------------------------------------------------------------------------------------
3: CONTAINER
-------------------------------------------------------------------------------------------- */
.container-wrap{
	width: 100%;
}


.container{
	width: 80%;
	max-width: 1080px;
	margin:0 auto;
	padding:0 15px;
}



.container-in{
	padding: 0 0 15%;
}



.container-in.menu-block,
.container-in.about-block,
.container-in.result-block,
.container-in.partner-block{
	text-align:center;
}



.container-in.ig-block{
	padding: 0 0 3%;
}

@media screen and (max-width:767px){
	.container{
		width: 96%;
	}
	.container-in.menu-block,
	.container-in.about-block,
	.container-in.result-block,
	.container-in.partner-block{
		padding: 0 0 30%;
	}
}









.logo{
	display: flex;
	justify-content: center;
	align-items: center;
}

.logo h1{
	width:20%;
	padding:20% 0 20%;
}




@media screen and (max-width:767px){
	.logo h1{
		width:40%;
		padding:30% 0 40%;
	}

}







.menu-block ul{
	display: flex;
	flex-wrap: wrap;
	justify-content:center;
}


.menu-block ul li{
	margin: 2rem;
}



.about-block p{
  font-style: normal;
  font-size: 1.6rem;
  line-height: 3;
}

.about-block li{
	margin: 0 0 2rem;
}

.ig-block{
	width: 5%;
	margin: auto;
}

.ig-block img{

}


.container-in.partner-block a{
	color:#fff;
}







@media screen and (max-width:767px){
	.menu-block ul li{
		width: 100%;
	}
	.ig-block{
		width: 15%;
	}


}




.result-block{
	text-align: center;
	display: block;
}

.result-block .ttl{
	margin-bottom: 3rem;
}

.result-block ul{
	text-align: left;
	display: inline-block;
}

.result-block ul li{
	margin: 0 0 2rem;
	font-size:1.6rem;
}





.link-svg{
	color: #fff;
	width: 18px;
	filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(129deg) brightness(103%) contrast(100%);
	margin: 0 0 5px 5px;
}

/* --------------------------------------------------------------------------------------------
	footer
-------------------------------------------------------------------------------------------- */


footer{
	text-align:center;
	padding: 4% 0 15px;
}







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

	footer{
		text-align:center;
		padding: 10% 0 15px;
	}

}