@charset "utf-8";

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


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

.sp{
	display:none;
}

.inner{
	position:relative;
	width:1200px;
	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{
	position:relative;
	min-width:320px;
}

.pc{
	display:none;
}

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

iframe{
	width:100%;
}
}


/* ========================================================================
	header
======================================================================== */
header{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:104px;
	background:#FFFFFF;
	z-index:10;
}

header .inner{
	width:auto;
	min-width:1260px;
	max-width:1440px;
}

@media screen and (max-width:767px){
header{
	height:70px;
}

header .inner{
	min-width:auto;
	max-width:none;
}
}


/* ----------------------------------------
	logo
---------------------------------------- */
header h1,
header .logo{
	position:absolute;
	top:20px;
	left:40px;
}

@media print, screen and (min-width:768px) and (max-width:1440px){
header h1,
header .logo{
	left:20px;
}
}

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

header h1 img,
header .logo img{
	width:auto;
	height:40px;
}
}


/* ----------------------------------------
	btn_01
---------------------------------------- */
header .btn_01{
	position:absolute;
	top:22px;
	right:20px;
}

header .btn_01 a{
	min-width:180px;
}

header .btn_01 span{
	justify-content:center;
	padding:0;
}
header .btn_01 span::before,
header .btn_01 span::after{ content:none; }

@media print, screen and (min-width:768px) and (max-width:1440px){
header .btn_01 a{
	min-width:140px;
}
}

@media screen and (max-width:767px){
header .btn_01{
	top:15px;
	right:70px;
}

header .btn_01 a{
	min-width:40px;
	min-height:40px;
}

header .btn_01 a::after{
	content:"";
	position:absolute;
	top:0;
	right:10px;
	width:20px;
	height:100%;
	background:url(../../img/common/icon_mail.svg) no-repeat center;
	filter:invert(90%) sepia(90%) saturate(2%) hue-rotate(283deg) brightness(106%) contrast(100%);
}

header .btn_01 span{
	display:none;
}
}


/* ========================================================================
	menu
======================================================================== */
#menu .btn{
	display:none;
}

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

#menu .btn span{
	display:none;
}

#menu .btn::before,
#menu .btn.close::before,
#menu .btn.close::after{
	content:"";
	display:block;
	position:relative;
	top:50%;
	left:50%;
	width:28px;
	height:3px;
	box-shadow:0 -6px 0 0 #1051B1, 0 6px 0 0 #1051B1;
	border-radius:2px;
	transform:translateX(-50%);
	transition-duration:0.2s;
}
#menu .btn.close::before{
	background:#1051B1;
	box-shadow:none;
	transform:translateX(-50%) rotate(45deg);
}
#menu .btn.close::after{
	top:calc(50% - 3px);
	background:#1051B1;
	box-shadow:none;
	transform:translateX(-50%) rotate(-45deg);
}
}


/* ----------------------------------------
	menu
---------------------------------------- */
@media screen and (max-width:767px){
#menu .menu{
	overflow-y:scroll;
	display:none;
	position:fixed;
	top:70px;
	left:0;
	width:100%;
	height:calc(100% - 70px);
	padding:0 0 84px 0;
	background:#FFFFFF;
	border-top:1px solid #dddddd;
	z-index:10;
}
}


/* gnavi
---------------------------------------- */
#menu .menu .gnavi{
	display:flex;
	align-items:center;
	gap:0 40px;
	position:absolute;
	top:22px;
	right:240px;
	height:60px;
}

#menu .menu .gnavi a{
	display:block;
	position:relative;
	font-weight:700;
	line-height:4.4rem;
	text-decoration:none;
}

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

@media print, screen and (min-width:768px) and (max-width:1440px){
#menu .menu .gnavi{
	gap:0 25px;
	right:185px;
}
}

@media screen and (max-width:767px){
#menu .menu .gnavi{
	display:block;
	position:static;
	height:auto;
	border-bottom:1px solid #dddddd;
}

#menu .menu .gnavi li{
	position:relative;
	border-top:1px solid #dddddd;
}
#menu .menu .gnavi > li:first-child{ border:none; }

#menu .menu .gnavi a{
	padding:0 20px;
	line-height:5.0rem;
}
#menu .menu .gnavi a::before{ content:none; }
}


/* ---------- open ---------- */
#menu .menu .gnavi .open{
	display:none;
}

@media screen and (max-width:767px){
#menu .menu .gnavi .open,
#menu .menu .gnavi .open::before{
	display:flex;
	justify-content:center;
	align-items:center;
	position:absolute;
	top:0;
	right:0;
	width:60px;
	height:50px;
	font-weight:700;
	cursor:pointer;
}
#menu .menu .gnavi .open::before{
	content:"＋";
	width:59px;
	background:#ffffff;
	border-left:1px solid #dddddd;
}
#menu .menu .gnavi .open.close::before{ content:"－"; }
}


/* ---------- child ---------- */
#menu .menu .child{
	display:none;
}

@media screen and (max-width:767px){
#menu .menu .child a{
	padding-left:calc(20px + 1.0em);
}
}


/* ========================================================================
	main
======================================================================== */
main{
	margin:104px 0 0 0;
}

main .widget_title + div,
main .path + div{
	padding:0 0 40px 0;
}

main h2{
	position:relative;
	margin:0 0 60px 0;
	padding:0 0 27px 0;
	text-align:center;
	font-size:3.8rem;
	font-weight:700;
	line-height:5.2rem;
	letter-spacing:0.08em;
}

main h2::before{
	content:"";
	position:absolute;
	bottom:0;
	left:50%;
	width:82px;
	height:4px;
	background:linear-gradient(90deg, #1051B1 0%, #0090DC 100%);
	border-radius:4px;
	box-shadow:0 0 4px rgba(36, 36, 36, 0.1);
	transform:translateX(-50%);
}

main h3{
	margin:0 0 40px 0;
	padding:0 0 0 36px;
	background:url(../../img/common/h3.png) no-repeat left 15px;
	background-size:16px;
	font-size:3.2rem;
	font-weight:700;
	line-height:4.6rem;
	letter-spacing:0.08em;
}

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

main .widget_title + div,
main .path + div{
	padding:0 0 20px 0;
}

main h2{
	margin:0 0 40px 0;
	padding:0 0 17px 0;
	font-size:2.4rem;
	line-height:3.8rem;
}

main h2::before{
	width:60px;
}

main h3{
	margin:0 0 20px 0;
	padding:0 0 0 26px;
	background-position:left 9px;
	font-size:2.0rem;
	line-height:3.4rem;
}
}


/* ========================================================================
	footer
======================================================================== */
footer{
	padding:0 0 50px 0;
	background:#444655;
	color:#FFFFFF;
}

footer .inner{
	display:flex;
	justify-content:space-between;
	padding:100px 0;
}

footer dl dt{
	position:relative;
	margin:0 0 20px 0;
	padding:0 0 0 24px;
	font-size:1.8rem;
	font-weight:700;
	line-height:1;
}

footer dl dt::before,
footer dl dt::after{
	content:"";
	position:absolute;
	top:2px;
	left:0;
	width:14px;
	height:14px;
	background:#FFFFFF;
	border-radius:50%;
}
footer dl dt::after{
	top:5px;
	left:3px;
	width:8px;
	height:8px;
	background:#444655;
}

footer dl dd{
	margin:0 0 50px 0;
	font-size:1.5rem;
	line-height:2.6rem;
}

footer dl dd span{
	display:block;
	font-size:1.6rem;
	font-weight:700;
}

footer small{
	display:block;
	max-width:1440px;
	margin:0 auto;
	padding:0 60px;
	text-align:right;
	font-size:1.3rem;
	line-height:1;
}

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

footer .inner{
	display:block;
	padding:0 20px;
}

footer .block{
	display:flex;
	flex-direction:column;
	align-items:center;
}

footer dl{
	padding:0 0 20px 0;
}

footer dl dt{
	margin:0 0 10px 0;
}

footer dl dd{
	margin:0 0 40px 0;
}

footer small{
	max-width:none;
	padding:0 20px;
	text-align:center;
	font-size:1.2rem;
}
}


/* ----------------------------------------
	pagetop
---------------------------------------- */
footer .pagetop{
	display:none;
	position:fixed;
	bottom:83px;
	right:40px;
	cursor:pointer;
	z-index:10;
}

@media screen and (max-width:767px){
footer .pagetop{
	bottom:74px;
	right:10px;
	width:60px;
}
}


/* ----------------------------------------
	logo
---------------------------------------- */
footer .logo{
	margin:0 0 100px 0;
}

@media screen and (max-width:767px){
footer .logo{
	margin:0 0 60px 0;
}

footer .logo img{
	width:340px;
}
}


/* ----------------------------------------
	contact
---------------------------------------- */
footer .contact{
	display:flex;
	gap:0 28px;
	padding:18px 0 102px 0;
}

footer .contact a{
	display:flex;
	position:relative;
	width:220px;
	height:60px;
	background:#FFFFFF;
	border-radius:30px;
	box-shadow:0 0 10px #1051B1;
	font-size:1.8rem;
	font-weight:700;
	color:#FFFFFF;
	text-decoration:none;
}
footer .contact a:hover{ color:#0090DC; }

footer .contact a::before{
	content:"";
	position:absolute;
	inset:0;
	background:linear-gradient(90deg, #1051B1 0%, #0090DC 100%);
	border-radius:28px;
	transition-duration:0.2s;
}

footer .contact a:hover::before{ opacity:0; }

footer .contact span{
	display:flex;
	align-items:center;
	width:100%;
	height:100%;
	position:relative;
	padding:0 0 0 68px;
}

footer .contact span::before{
	content:"";
	position:absolute;
	top:50%;
	left:12px;
	width:40px;
	height:40px;
	background:#FFFFFF;
	border-radius:50%;
	transform:translateY(-50%);
	transition-duration:0.2s;
}
footer .contact a:hover span::before{ background:#0090DC; }

footer .contact span::after{
	content:"";
	position:absolute;
	top:0;
	left:22px;
	width:20px;
	height:100%;
	background:url(../../img/common/icon_mail.svg) no-repeat center;
	filter:invert(21%) sepia(76%) saturate(2370%) hue-rotate(207deg) brightness(90%) contrast(93%);
}
footer .contact .request span::after{
	left:23px;
	width:18px;
	background-image:url(../../img/common/icon_request.svg);
}
footer .contact .tel span::after{
	left:24px;
	width:16px;
	background-image:url(../../img/common/icon_tel.svg);
}
footer .contact a:hover span::after{ filter:invert(90%) sepia(90%) saturate(2%) hue-rotate(283deg) brightness(106%) contrast(100%); }

@media screen and (max-width:767px){
footer .contact{
	display:none;
}
}


/* ----------------------------------------
	menu
---------------------------------------- */
footer .menu{
	display:flex;
	gap:0 50px;
}

footer .menu a{
	display:inline-block;
	font-size:1.8rem;
	font-weight:700;
	color:#FFFFFF;
	line-height:4.8rem;
	text-decoration:none;
}
footer .menu a:hover{ text-decoration:underline; }

footer .menu ul ul a{
	position:relative;
	padding:0 0 0 22px;
	font-size:1.6rem;
	font-weight:400;
	line-height:4.2rem;
}

footer .menu ul ul a::before{
	content:"";
	position:absolute;
	top:50%;
	left:0;
	width:10px;
	height:1px;
	background:#FFFFFF;
}

@media screen and (max-width:767px){
footer .menu{
	display:none;
}
}


/* ----------------------------------------
	btn
---------------------------------------- */
footer .btn{
	display:none;
}


@media screen and (max-width:767px){
footer .btn{
	display:flex;
	position:fixed;
	bottom:0;
	left:0;
	width:100%;
	height:64px;
	background:linear-gradient(90deg, #1051B1 0%, #0090DC 100%);
	border-radius:10px 10px 0 0;
	box-shadow:0 0 10px #1051B1;
	z-index:10;
}

footer .btn a{
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	position:relative;
	width:50%;
	border-radius:0 10px 0 0;
	border-left:1px solid #D9D9D9;
	font-size:1.6rem;
	color:#FFFFFF;
	line-height:1;
	text-decoration:none
}

footer .btn a > span,
footer .btn .tel .num{
	position:relative;
	padding:0 0 0 44px;
	font-weight:700;
	line-height:2.8rem;
}
footer .btn .tel .num{
	padding:0 0 0 38px;
}

footer .btn a > span::before,
footer .btn .tel .num::before{
	content:"";
	position:absolute;
	top:50%;
	left:0;
	width:28px;
	height:28px;
	background:#FFFFFF;
	border-radius:50%;
	transform:translateY(-50%);
}

footer .btn a > span::after,
footer .btn .tel .num::after{
	content:"";
	position:absolute;
	top:0;
	left:8px;
	width:12px;
	height:100%;
	background:url(../../img/common/icon_request.svg) no-repeat center;
	filter:invert(21%) sepia(76%) saturate(2370%) hue-rotate(207deg) brightness(90%) contrast(93%);
	will-change:filter;
}
footer .btn .tel .num::after{ background-image:url(../../img/common/icon_tel.svg); }


/* tel
---------------------------------------- */
footer .btn .tel{
	border:none;
	border-radius:10px 0 0 0;
}

footer .btn .tel .time{
	padding:6px 0 0 0;
	font-size:1.0rem;
	font-weight:700;
}

footer .btn .tel .time span{
	color:#FF5941;
}
}