@charset "utf-8";

/*		Contents
---------------------------------------------------------------------------
	common
	header
	main
	footer
------------------------------------------------------------------------ */


/* ========================================================================
	common
======================================================================== */
@media print, screen and (min-width:768px){
body{
	min-width:1260px;
}

.sp{
	display:none;
}

.inner{
	position:relative;
	width:1166px;
	margin:0 auto;
}

a img, .fade, .fades a{ transition-duration:0.2s; }
a:hover img, .fade:hover, .fades a:hover{ opacity:0.8; }
.fade:hover img, .fades a:hover img{ opacity:1; }
}

@media screen and (max-width:767px){
body{
	width:100%; /* splide */
	min-width:320px;
}

.pc{
	display:none;
}

.inner{
	position:relative;
	padding:0 20px;
}
}


/* ========================================================================
	header
======================================================================== */
header .fix,
header .scroll{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	min-width:1260px;
	height:90px;
	background:#262626;
	z-index:10;
}

header .scroll{
	display:none;
}

@media screen and (max-width:767px){
header .fix{
	position:relative;
	min-width:auto;
	height:auto;
}

header .scroll{
	display:none !important;
}
}


/* ----------------------------------------
	logo
---------------------------------------- */
header .logo{
	position:absolute;
	top:28px;
	left:30px;
}

header .logo img{
	width:auto;
	height:34px;
}

@media screen and (max-width:767px){
header .logo{
	position:absolute;
	top:30px;
	left:20px;
}

header .logo img{
	height:30px;
}
}


/* ----------------------------------------
	menu
---------------------------------------- */
header .menu .btn{
	display:none;
}

header .menu .gnavi{
	display:flex;
	position:absolute;
	top:20px;
	right:15px;
}

header .menu .gnavi ul{
	display:flex;
}

@media screen and (max-width:767px){
header .menu .btn{
	display:block;
	position:fixed;
	top:20px;
	right:20px;
	cursor:pointer;
	z-index:10;
}

header .menu .gnavi{
	overflow-y:scroll;
	display:none;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	padding:80px 0 30px 0;
	background:rgba(0,0,0,0.8)
}
}


/* navi
---------------------------------------- */
header .navi{
	padding:7px 0 0 0;
}

header .navi a{
	display:flex;
	align-items:center;
	position:relative;
	height:35px;
	margin:0 30px 0 0;
	font-size:1.5rem;
	font-weight:700;
	color:#FFFFFF;
	line-height:1;
	text-decoration:none;
}

header .navi a::before{
	content:"";
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	height:2px;
	background:transparent;
	transition-duration:0.2s;
}
header .navi a:hover::before{ background:#FFFFFF; }

@media print, screen and (min-width:768px) and (max-width:1400px){
header .navi a{
	margin-right:20px;
	font-size:1.4rem;
}
}

@media screen and (max-width:767px){
header .menu .gnavi .navi{
	display:block;
	padding:0;
}

header .navi a{
	justify-content:center;
	height:36px;
	margin:0 0 10px 0;
	font-size:1.6rem;
}
header .navi a::before{ content:none; }
}


/* contact
---------------------------------------- */
header .contact li{
	margin:0 15px 0 0;
}

@media screen and (max-width:767px){
header .contact{
	justify-content:center;
	gap:0 20px;
	padding:10px 0 0 0;
}

header .contact li{
	margin:0;
}
}


@media print, screen and (min-width:768px){
/* ----------------------------------------
	home
---------------------------------------- */
header.home .fix{
	position:absolute;
	height:auto;
	background:none;
}


/* logo
---------------------------------------- */
header.home .fix .logo{
	top:40px;
}

header.home .fix .logo img{
	height:41px;
}


/* menu
---------------------------------------- */
header.home .fix .menu .gnavi{
	position:static;
}


/* ---------- navi ---------- */
header.home .fix .navi{
	flex-direction:column;
	position:absolute;
	top:140px;
	left:60px;
	padding:0;
}

header.home .fix .navi a{
	display:inline-block;
	height:auto;
	margin:0 0 2px 0;
	font-size:1.6rem;
	line-height:3.6rem;
	text-decoration:none;
}


/* ---------- contact ---------- */
header.home .fix .contact{
	position:absolute;
	top:30px;
	right:30px;
}

header.home .fix .contact img{
	width:60px;
}
}


/* ========================================================================
	main
======================================================================== */
main{
	overflow:hidden;
	padding:90px 0 0 0;
}

@media screen and (max-width:767px){
main{
	padding:0;
}
}


/* ========================================================================
	footer
======================================================================== */
footer small{
	display:block;
	padding:0 30px 24px 0;
	text-align:right;
	font-size:1.4rem;
	line-height:1;
}

@media screen and (max-width:767px){
footer .inner{
	padding:0;
}

footer small{
	padding:0 20px 20px 0;
	font-size:1.2rem;
}
}


/* ----------------------------------------
	contact
---------------------------------------- */
footer .contact{
	display:flex;
	justify-content:center;
	align-items:center;
	gap:0 36px;
	margin:0 0 66px 0;
	padding:137px 0 220px 0;
	background:url(../../img/common/Illust_02.png) no-repeat center bottom, url(../../img/common/Illust_01.png) no-repeat center top;
	background-size:auto 210px, 468px 89px;
}

footer .contact ul{
	display:flex;
	gap:0 20px;
}

@media screen and (max-width:767px){
footer .contact{
	display:block;
	margin:0 0 30px 0;
	padding:84px 0 104px 0;
	background-size:auto 104px, auto 44px;
	text-align:center;
}

footer .contact ul{
	justify-content:center;
	margin:20px 0 0 0;
}
}


/* ----------------------------------------
	menu
---------------------------------------- */
footer .menu ul{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	gap:0 46px;
	margin:0 0 50px 0;
}

/*footer .menu ul li:last-child{
	width:100%;
	margin:30px 0 0 0;
}*/

footer .menu a{
	display:flex;
	justify-content:center;
	align-items:center;
	position:relative;
	height:36px;
	font-weight:700;
	line-height:1;
	text-decoration:none;
}

footer .menu a::before{
	content:"";
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
	height:2px;
	background:transparent;
	transition-duration:0.2s;
}
footer .menu a:hover::before{ background:#262626; }

@media screen and (max-width:767px){
footer .menu ul{
	gap:0 30px;
	margin:0 20px 40px;
}

footer .menu a{
	height:34px;
	font-size:1.4rem;
}

footer .menu a::before{
	content:none;
}
}


/* btn
---------------------------------------- */
footer .menu .btn{
	width:246px;
	height:52px;
	margin:0 auto;
	border:1px solid #262626;
	border-radius:26px;
}
footer .menu a.btn::before{ content:none; }

footer .menu .btn:hover{
	background:#262626;
	color:#FFFFFF;
}

@media screen and (max-width:767px){
footer .menu .btn{
	font-size:1.6rem;
}
}