/* ==============================================================================
    CSS for touch-screen : common.css
============================================================================== */

/* ----------------------------------------------------------
  Common Settings : css-reset
---------------------------------------------------------- */
html{
font-family: Meiryo,'Hiragino Kaku Gothic ProN','Hiragino Sans',sans-serif;
overflow-y:scroll;
-webkit-text-size-adjust:none;
-webkit-font-smoothing: antialiased;
-webkit-backface-visibility:hidden;
backface-visibility:hidden;
}

body,div,h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,form,fieldset,legend,input,textarea,pre,code,blockquote,th,td{
margin:0;
padding:0;
}

div,h2,h3,h4,h5,h6,p,li,dt,dd,pre,code,blockquote,th,td{
word-break:break-all;
}

br{
letter-spacing:0;
}

fieldset,img{
border:0;
}

li{
list-style:none;
}

caption,th{
text-align:left;
}

h1,h2,h3,h4,h5,h6,th{
font-size:100%;
font-weight:normal;
font-style:normal;
}

input,textarea,select{
font-family:inherit;
font-size:inherit;
font-weight:inherit;
color:#121212;
}

input[type="submit"]{
cursor:pointer;
}

select{
background-color:#ffffff !important;
}

address,caption,cite,code,dfn,var{
font-style:normal;
font-weight:normal;
}

abbr,acronym{
border:0;
font-variant:normal;
}

del,u{
text-decoration:none;
}

/*=================================================
 * CSS MAIN
 * ================================================= */

body{
	text-align	: center;
	font-size	: 12px;
	line-height	: 16px;
	font-family: Meiryo,'Hiragino Kaku Gothic ProN','Hiragino Sans',sans-serif;
    -webkit-text-size-adjust: 100%;
	scrollbar-face-color: #ffffff;
	scrollbar-3dlight-color: #553f09;
	scrollbar-highlight-color: #ffffff;
	scrollbar-shadow-color: #ffffff;
	scrollbar-darkshadow-color: #553f09;
	scrollbar-arrow-color: #553f09;
	scrollbar-track-color: #ffffff;
	-webkit-font-smoothing: subpixel-antialiased;
}

a{
	text-decoration	: none;
}

a:hover{
	text-decoration	: underline;
}

a[href^="tel:"] { cursor: default; text-decoration: none; color: #000}
a[href^="tel:"]:hover{	text-decoration: none;}

h1,h2,h3{
	font-size	: 13px;
}

ul{
	list-style-type	: none;
}

li{
	margin		: 0px;
	padding		: 0px;
}

table{
	font-size	: 13px;
}

table tr{
	vertical-align	: top;
}

i, em{
	font-style		: normal;
}


/*=================================================
 * CSS for PC
 * ================================================= */

body{
	min-width: 1200px;
	background: url(../img/all/bg.jpg) no-repeat top center fixed;
	background-size: cover;
}


/** header **/

header{
	position: relative;
	width: 100%;
	height: 190px;
	text-align: center;
	margin: 0;
	padding: 0;
	background: url(../img/all/header_img.png) no-repeat calc(50% + 370px) 0;
	background-size: auto 190px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
h1{
	font-size: 10px;
	font-weight: normal;
	line-height: 10px;
	color: #999;
	padding: 10px 0 15px 0;
}

#homelink{
	display: inline-block;
	vertical-align: top;
}
#homelink img{
	width: 240px;
	height: auto;
}
#h_info{	margin: 10px 0 0 0;}
#h_info,
#h_info a{	color: currentColor;}
#h_info a{	text-decoration: underline;}
#h_info a:hover{	text-decoration: none;}
#h_info p{
	display: inline-block;
	vertical-align: top;
	font-size: 15px;
	line-height: 22px;
	margin: 0 10px;
}
#h_info p span{
	position: relative;
	top: -1.5px;
	font-size: 11px;
	line-height: 17px;
	color: #fff;
	background: #16288a;
	margin-right: 5px;
	padding: 0 5px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

#h_line{
	position: absolute;
	width: 60px;
	height: 60px;
	top: 20px;
	left: 20px;
}
#h_line img{
	border-radius: 3px;
}

#navToggle, #sp_submenu{	display: none;}
#navToggle, #navToggle button{
	font-size: 0;
	line-height: 0;
	border: none;
	outline: none;
	margin: 0;
	padding: 0;
}


/** menu **/

nav{
	width: 100%;
	font-size: 0;
	line-height: 0;
	background: linear-gradient(to top, rgba(1, 7, 132, 0.9), rgba(39, 46, 186, 0.9), rgba(1, 7, 132, 0.9));
	position: -webkit-sticky; /* Safari */
	position: sticky;
	z-index: 1000001;
	top: 0;
	left: 0;
	-webkit-transition	: 0.4s ease-in-out;
	-moz-transition	: 0.4s ease-in-out;
	-o-transition	: 0.4s ease-in-out;
	transition		: 0.4s ease-in-out;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
nav div{
	width: 1200px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	align-content: center;
	justify-content: center;
}
nav a{
	position: relative;
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	align-content: center;
	justify-content: center;
	width: calc(100% / 7);
	height: 60px;
	margin: 0;
	color: #fff;
	border-left: 1px solid rgba(255, 255, 255, 0.3);
	-webkit-transition	: 0.2s ease-in-out;
	-moz-transition	: 0.2s ease-in-out;
	-o-transition	: 0.2s ease-in-out;
	transition		: 0.2s ease-in-out;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
nav a:nth-of-type(-n + 7){	border-bottom: 1px solid rgba(255, 255, 255, 0.3);}
nav a:nth-of-type(7n){	border-right: 1px solid rgba(255, 255, 255, 0.3);}
nav a:hover{
	color: #fff;
	text-decoration: none;
	opacity: 0.7;
	filter: alpha(opacity=70);
}
nav a span{
	width: 100%;
	font-family: "FontA";
	font-size: 20px;
	line-height: 24px;
}
nav a em{
	width: 100%;
	font-size: 11px;
	line-height: 1.2;
}
nav a.on{
	background: #ff50a0;
}


/** title **/

.page_title{
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	align-content: center;
	justify-content: center;
	height: 180px;
	text-align: center;
	color: #16288a;
	margin: 0 0 40px 0;
	background: rgba(22, 40, 138, 0.15);
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.page_title i{
	position: relative;
	display: inline-flex;
	align-items: center;
	align-content: center;
	justify-content: center;
	font-family: "FontA";
	font-size: 15px;
	line-height: 20px;
	color: #fff;
	text-align: left;
	letter-spacing: 1px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.page_title i:before,
.page_title i:after{
	content: "";
	width: 50px;
	border-bottom: 1px solid #ffec19;
	position: absolute;
	top: 8px;
}
.page_title i:before{	left: -58px;}
.page_title i:after{	right: -58px;}
.page_title span{
	width: 100%;
	font-family: "FontA";
	font-size: 74px;
	line-height: 1.1;
}
.page_title em{
	width: 100%;
	font-size: 15px;
	line-height: 25px;
}


/** main **/

main{
	display: block;
	padding: 0 0 40px 0;
	overflow: hidden;
}


/** footer **/

footer{
	position: relative;
	color: #fff;
	padding: 50px 0;
	background: url(../img/all/footer.jpg) no-repeat 0 0;
	background-size: cover;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
.pan{
	font-size: 13px;
	line-height: 18px;
	color: #666;
	margin: 0 0 50px 0;
}
.pan a,
.pan span{	color: #fff;}

#f_info{
	margin: 0 0 50px 0;
	padding: 100px 0 0 0;
	background: url(../img/all/f_logo.png) no-repeat top center;
	background-size: 195px auto;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
#f_info,
#f_info a{	color: #fff;}
#f_info p{
	font-size: 15px;
	line-height: 22px;
}
#f_info p span{
	position: relative;
	top: -1.5px;
	font-size: 11px;
	line-height: 17px;
	color: #000;
	background: #fff;
	margin-right: 5px;
	padding: 0 5px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

#fmenu{
	position: relative;
	width: 600px;
	font-size: 0;
	line-height: 0;
	margin: 0 auto 50px auto;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
#fmenu a{
	display: inline-flex;
	align-items: center;
	align-content: center;
	justify-content: center;
	width: 110px;
	font-size: 12px;
	line-height: 30px;
	color: #fff;
	border-bottom: 1px solid #666;
	margin: 0 5px 10px 5px;
	-webkit-transition	: 0.2s ease-in-out;
	-moz-transition	: 0.2s ease-in-out;
	-o-transition	: 0.2s ease-in-out;
	transition		: 0.2s ease-in-out;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
#fmenu a:hover{
	text-decoration: none;
	color: #fff;
	opacity: 0.7;
	filter: alpha(opacity=70);
}

footer #copyright{
	font-size: 12px;
	line-height: 22px;
	text-align: center;
	color: #fff;
}
footer #des a{	color: #fff;}
footer #des a:hover{	text-decoration: none;}
footer #copy br{	display: none;}

.error,
.over{
	text-align: center;
	padding: 80px 0;
	font-size: 12px;
	line-height: 16px;
}

.error{
	color: #ff0000;
}


/** ovrebox **/

#overbox_bg{
	position: relative;
	max-width: 1000px;
	background: rgba(1, 7, 132, 0.8);
	margin: 0 auto;
	padding: 40px;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
#overbox{
	text-align: left;
	color: #fff;
	padding: 40px 300px 40px 40px;
	background: url(../img/all/overbox.png) no-repeat top right #F68392;
	background: url(../img/all/overbox.png) no-repeat top right, linear-gradient(90deg, rgba(246, 131, 146, 1) 0%, rgba(255, 186, 195, 1) 100%);
	background-size: auto 100%, auto;
}
#overbox p,
#overbox ul{
	position: relative;
	z-index: 2;
}
#overbox p:nth-of-type(1){
	font-size: 26px;
	font-weight: bold;
	line-height: 30px;
	margin: 0 0 20px 0;
	padding: 0 0 30px 0;
	border-bottom: 3px double currentColor;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
#overbox p:nth-of-type(2){
	font-size: 16px;
	line-height: 24px;
	margin: 0 0 20px 0;
}
#overbox ul{
	width: 400px;
	font-size: 0;
	line-height: 0;
}
#overbox li{
	position: relative;
	display: flex;
	align-items: center;
	align-content: center;
	justify-content: flex-start;
	height: 45px;
	font-size: 16px;
	line-height: 25px;
	margin: 0 0 5px 0;
	padding: 10px 10px 10px 30px;
	background: rgba(255, 255, 255, 0.2);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}
#overbox li span{
	position: absolute;
	font-size: 16px;
	top: 14px;
	left: 10px;
}


/*=================================================
 * CSS for SP
 * ================================================= */

@media screen and (max-width: 650px) {
	body{
		min-width: auto;
		padding-top: 0;
		padding-left: 0;
		background: none;
	}
	body:before{
		content:"";
		display:block;
		position:fixed;
		top:0;
		left:0;
		z-index:-1;
		width:100%;
		height:100vh;
		height:100lvh;
		background: url(../img/all/bg.jpg) no-repeat top center;
		-webkit-background-size: cover;
		background-size: cover;
	}
	a[href^="tel:"] { cursor: pointer;}
	a:hover{	text-decoration: none;}

	/** header **/

	header{
		width: 100%;
		height: auto;
		text-align: center;
		margin: 0;
		padding: 0;
		background: url(../img/all/header_img.png) no-repeat calc(100% + 20px) 0;
		background-size: auto 125px;
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
		        box-sizing: border-box;
	}
	h1{
		font-size: 10px;
		font-weight: normal;
		line-height: 10px;
		color: #999;
		padding: 5px 0;
	}

	#homelink{
		display: inline-block;
		vertical-align: top;
	}
	#homelink img{
		width: auto;
		height: 54px;
	}
	#h_info{
		text-align: left;
		margin: 0 0 0 0;
	}
	#h_info,
	#h_info a{	color: currentColor;}
	#h_info p{
		display: block;
		font-size: 12px;
		line-height: 15px;
		padding: 0 0 5px 0;
	}
	#h_info p:last-of-type{	padding-bottom: 10px;}
	#h_info p span{
		display: inline-block;
		width: 37px;
		text-align: center;
		position: relative;
		top: -1.5px;
		font-size: 10px;
		line-height: 15px;
		margin-right: 5px;
		padding: 0 2px;
	}

	#h_line{
		position: fixed;
		width: 45px;
		height: 45px;
		top: 10px;
		left: 10px;
		z-index: 1000000;
	}
	#h_line img{
	border-radius: 3px;
}

	/** sp_submenu **/
	#sp_submenu{
		display: block;
		font-size: 0;
		line-height: 0;
		background: linear-gradient(to top, rgba(1, 7, 132, 0.9), rgba(39, 46, 186, 0.9), rgba(1, 7, 132, 0.9));
	}
	#sp_submenu a{
		display: inline-flex;
		flex-wrap: wrap;
		align-items: center;
		align-content: center;
		justify-content: center;
		width: calc(100% / 4);
		height: 40px;
		color: #fff;
		border-right: 1px solid rgba(255, 255, 255, 0.3);
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
		        box-sizing: border-box;
	}
	#sp_submenu a:nth-of-type(4n){	border-right: none;}
	#sp_submenu a:nth-of-type(-n + 4){	border-bottom: 1px solid rgba(255, 255, 255, 0.3);}
	#sp_submenu a span{
		width: 100%;
		font-family: "FontA";
		font-size: 14px;
		line-height: 1.4;
	}
	#sp_submenu a em{
		width: 100%;
		font-size: 8px;
		line-height: 1.2;
	}
	#sp_submenu a.on{
		background: #ff50a0;
	}


	/** navToggle **/
	#navToggle{
		display: none;
		width: 65px;
		height: 65px;
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
		        box-sizing: border-box;
		position: fixed;
		z-index: 1000002;
		top: 10px;
		right: 0;
	}
	#navToggle.open{	display: block !important; opacity: 1 !important; filter: alpha(opacity=100) !important;}
	#navToggle button,
	#navToggle a{
		position: relative;
		display: inline-flex;
		flex-wrap: wrap;
		align-items: center;
		align-content: center;
		justify-content: center;
		width: 65px;
		height: 65px;
		text-align: center;
		cursor: pointer;
		border: none;
		color: #fff;
		background: rgba(1, 7, 132, 0.9);
		box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.2);
		margin: 0;
		padding: 0;
	}
	#navToggle button:focus{	outline: 0;}
	#navToggle a{
		background: url(../img/all/tel.png) no-repeat 50% 9px;
		background-size: 25px auto;
	}
	#navToggle button em,
	#navToggle a em{
		width: 65px;
		font-family: "FontA";
		font-size: 14px;
		line-height: 1;
		text-align: center;
		color: #fff;
		position: absolute;
		bottom: 9px;
		right: 0;
	}
	.bb{
		width: 30px;
		height: 1px;
		right: 17.5px;
		background: #fff;
		transition: all .4s ease;
		position: absolute;
		-webkit-transition: all .4s ease;
	}
	.bb-1{	top:16px;}
	.bb-2{	top:24px;}
	.bb-3{	top:32px;}
	.closebt .bb-1{
		top: 24px;
		-webkit-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		transform:rotate(45deg);
	}
	.closebt .bb-2{
		opacity: 0;
	}
	.closebt .bb-3{
		top: 24px;
		-webkit-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
	nav{
		max-width: 100%;
		width: 100%;
		height: 100vh;
		text-align: left;
		font-size: 0;
		line-height: 0;
		position: fixed;
		z-index: 1000000;
		left: auto;
		right: 0;
		top: -120vh;/** header,nav,SAME HEIGHT **/
		background: rgba(0, 0, 0, 0.86);
		overflow: hidden;
		-webkit-transition	: 0.2s ease-in-out;
		-moz-transition	: 0.2s ease-in-out;
		-o-transition	: 0.2s ease-in-out;
		transition		: 0.2s ease-in-out;
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		-o-box-sizing: border-box;
		-ms-box-sizing: border-box;
		padding: 20px 0;
		backdrop-filter: blur(10px);
		-webkit-backdrop-filter: blur(10px);
	}
	nav.opennav{
		top: 0;
		height: 100vh;
		height: 100dvh;
		align-content: start;
		padding-top: 85px;
		overflow: visible;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
	}
	nav.opennav::-webkit-scrollbar{
	  display: none;
	}
	nav div{
		width: 100%;
		margin: 0;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		align-content: center;
		justify-content: center;
		padding: 0 20px;
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
		        box-sizing: border-box;
	}
	nav a{
		width: calc(100% / 2 - 1px);
		text-align: center;
		border-left: none;
		background: rgba(255, 255, 255, 0.1);
		margin: 0 0.5px 1px 0.5px;
	}
	nav a:nth-of-type(-n + 7){	border-bottom: none;}
	nav a:nth-of-type(7n){	border-right: none;}

	/** title **/
	.page_title{
		height: 105px;
		margin: 0 0 15px 0;
	}
	.page_title i{
		position: relative;
		display: inline-flex;
		align-items: center;
		align-content: center;
		justify-content: center;
		font-family: "FontA";
		font-size: 10px;
		line-height: 20px;
		color: #fff;
		text-align: left;
		letter-spacing: 1px;
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
		        box-sizing: border-box;
	}
	.page_title i:before,
	.page_title i:after{
		content: "";
		width: 30px;
		border-bottom: 1px solid #ffec19;
		position: absolute;
		top: 8px;
	}
	.page_title i:before{	left: -38px;}
	.page_title i:after{	right: -38px;}
	.page_title span{
		font-size: 48px;
		line-height: 1;
	}
	.page_title em{
		font-size: 13px;
		line-height: 18px;
	}


	/** main **/
	main{
		display: block;
		width: 100%;
		padding: 0 0 10px 0;
	}

	/** footer **/
	footer{
		padding: 30px 0;
		background: url(../img/all/footer.jpg) no-repeat center top;
		background-size: auto 100%;
	}
	.pan{
		font-size: 10px;
		line-height: 15px;
		margin: 0 0 10px 0;
	}
	#f_info{
		margin: 0 0 20px 0;
		padding: 70px 0 0 0;
		background: url(../img/all/f_logo.png) no-repeat top center;
		background-size: 115px auto;
	}
	#f_info p{
		font-size: 13px;
		line-height: 22px;
	}
	#f_info p span{
		position: relative;
		top: -1.5px;
		font-size: 10px;
		line-height: 12px;
		margin-right: 3px;
		padding: 0 2px;
	}
	#fmenu{
		position: relative;
		width: 240px;
		margin: 0 auto 30px auto;
	}
	#fmenu a{
		width: 110px;
		font-size: 12px;
		line-height: 40px;
		margin: 0 5px;
	}
	footer #copyright{
		font-size: 10px;
		line-height: 22px;
		text-align: center;
	}
	.error,
	.over{
		padding: 50px 0;
	}
	.sp_no{
		display: none;
	}


	/** ovrebox **/
	#overbox_bg{
		position: relative;
		max-width: 1000px;
		background: rgba(1, 7, 132, 0.8);
		margin: 0 10px;
		padding: 10px;
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
		        box-sizing: border-box;
	}
	#overbox{
		position: relative;
		text-align: left;
		color: #fff;
		padding: 10px 100px 5px 10px;
		background: url(../img/all/overbox_sp.png) no-repeat top right #F68392;
		background: url(../img/all/overbox_sp.png) no-repeat top right, linear-gradient(90deg, rgba(246, 131, 146, 1) 0%, rgba(255, 186, 195, 1) 100%);
		background-size: auto 100%, auto;
	}
	#overbox p:nth-of-type(1){
		font-size: 18px;
		line-height: 20px;
		margin: 0 0 10px 0;
		padding: 5px 0 10px 0;
	}
	#overbox p:nth-of-type(2){
		font-size: 14px;
		line-height: 20px;
		margin: 0 0 10px 0;
	}
	#overbox p:nth-of-type(2) br{	display: none;}
	#overbox ul{
		width: auto;
		font-size: 0;
		line-height: 0;
	}
	#overbox li{
		position: relative;
		display: flex;
		align-items: center;
		align-content: center;
		justify-content: flex-start;
		height: auto;
		font-size: 12px;
		line-height: 16px;
		margin: 0 0 5px 0;
		padding: 10px 10px 10px 30px;
		background: rgba(255, 255, 255, 0.2);
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
		        box-sizing: border-box;
	}
	#overbox li span{
		position: absolute;
		font-size: 16px;
		top: 9px;
		left: 10px;
	}

}