@charset "utf-8";
/* CSS Document */

body{
	font-family: YuGothic, "Yu Gothic", sans-serif;
	font-size: 15px;
	color: #0D0D0D;
    height: auto;
    margin: 0;
    padding: 0;
}
header{
	border-bottom: 2px solid #11116e;	
}
.js-floating__inner{
	width: 100%;
	margin: 0 auto;
	display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
	position: relative;
    box-sizing: border-box;
}
header .sns{
    position: absolute;
    right: 25%;
    top: 50%;
}
header .sns a.youtube{
    margin-bottom: 20px;
    padding: 10px 10px 10px 30px;
    border-radius: 10px;
    color: #11116e;
    border: solid 2px #11116e;
}
header .sns a.youtube span{
    position: relative;
    display: contents;
}
header .sns a.youtube span::before{
    position: absolute;
    content: "▼";
    left: 12px;
    transform: rotate(-90deg);
}
header .sns a.youtube:hover{
}

header address h2{
	font-size: 1.0em;
	padding-left: 0 !important;
	border-left: none !important;
	background-color: inherit !important;
	color: #11116e !important;
}
.header-btn{
	float: right;
}
.header-btn li{
	background-color: #11116e;
	padding: 10px 20px;
	border-right: 1px solid #fff;
	float: left;
	list-style: none;
}
.header-btn li:hover{ opacity: 0.8;}

.nav {
	font-family: YuGothic, "Yu Gothic", sans-serif;
    padding: 0;
    list-style: none;
    position: relative;
    margin: 0 auto;
    box-sizing: border-box;
}
.nav-category {
    margin: 0 0 30px;
    padding: 0;
    list-style: none;
}
.nav-cat-ttl {
    margin: 0;
    font-size: 16px;
	position: relative;
	float: left;
}
.nav-cat-ttl::after {
	position: absolute;
	content: "▼";
	top:6px;
	transform: rotate( -90deg);
	font-size: 0.6em;
}
.nav-cat-ttl:hover a{ color: #0068b7;}
.nav-cat-ttl:hover::after {	
	color: #0068b7;
}
.nav-prim-li {
    display: table;
    box-sizing: border-box;
	float: left;
	width: 20%;
	text-align: center;
}
.nav-prim-li:hover{ background: rgba(17,17,110,0.5);}
.nav-prim-li:hover .nav-prim{ color: #fff;}
.nav-prim {
    display: table-cell;
    line-height: 1.2;
    height: 50px;
    text-align: center;
    vertical-align: middle;
    padding: 0 !important;
	position: relative;
    font-family: YuGothic, "Yu Gothic", sans-serif;
}
.nav-prim::before {
    margin-right: 10px;
    vertical-align: -2px;
}
.nav-corporate::before {
    width: 24px;
    height: 24px;
    background-image: url(/images/corporate-icn.png);
    background-repeat: no-repeat;
    background-size: 100%;
    content: "";
}
.nav-service::before {
    width: 24px;
    height: 24px;
    background-image: url(/images/service-icn.png);
    background-repeat: no-repeat;
    background-size: 100%;
    content: "";
}
.nav-plan::before {
    width: 24px;
    height: 24px;
    background-image: url(/images/plan-icn.png);
    background-repeat: no-repeat;
    background-size: 100%;
    content: "";
}
.nav-map::before {
    width: 24px;
    height: 24px;
    background-image: url(/images/map-icn.png);
    background-repeat: no-repeat;
    background-size: 100%;
    content: "";
}
.nav-recruit::before {
    width: 24px;
    height: 24px;
    background-image: url(/images/recruit-icn.png);
    background-repeat: no-repeat;
    background-size: 100%;
    content: "";
}
.nav-prim::after {
    position: absolute;
    bottom: 24px;
    left: 24px;
    display: block;
    border-color: transparent transparent #382518;
    border-style: solid;
    border-width: 0 6px 8px;
    transform: translateX(-50%);
    opacity: 0;
    content: "";
}
.nav-prim-li{
	transition-duration: 1000ms;
	transition-timing-function:ease-in-out;
}
.nav-secondary {
    position: absolute;
    top: 28px;
    left: 0;
    background: rgba(255,255,255,0.95);
    text-align: left;
    transition: 0;
    opacity: 0;
    pointer-events: none;
    z-index: 0;
}
.nav-secondary__wrap {
    float: left;
    box-sizing: border-box;
    width: 50%;
}
.nav-secondary__wrap:first-child {
    padding-right: 10px;
}
.nav-secondary:last-child {
    margin-bottom: 0;
	padding-right: 10px;
}
.nav-cat-ttl a { display: block;}
.pkz{
	background-color: #11116e;
	display: block;
	padding: 3px;
	width: 100%;
	font-size: 0.9em;
}
.pkz li { display: inline;}
.pkz li span{color: #FFFFFF !important;}
.pkz li a{
	position: relative;
	padding: 0 20px;
}
.pkz li a:after{
	position: absolute;
	content: "▼";
	right: 0;
	top:3px;
	transform: rotate( -90deg);
	color: #FFFFFF;
	font-size: 8px;
}

h1:not(.logo){
	color: #11116e;
	border-bottom: 2px solid #11116e;	
	font-size: 2.0em;
	padding:0 10px;
}
h2{
	border-left: 5px solid #11116e;	
	background: rgba(17,17,110,0.5);
	padding:5px 10px;
	color: #fff;
	font-weight: normal;
}
h3{
	border-left: 7px solid #11116e;
	padding-left: 10px;
}
article{
	display: block;
	margin: 0 auto;
}
a:hover{ opacity: 0.8;}
a.words{border-bottom: #555555 1px dashed;}
a.words:hover{ border: none;}
a.out-link{
    text-align: right;
    position:relative;
    padding:5px 25px 5px 10px;
    background: #11116e;
    color:#ffffff;
}
a.out-link:after{
    position: absolute;
    content: "▼";
    right: 8px;
    top: 8px;
    transform: rotate( -90deg);
    font-size: 0.6em;
}
.sec-box a:not(.words){ text-decoration: underline;}
.small-txt{ font-size:0.8em;}

/* ページTOPへ戻る */
#TopBtn {
    position: fixed; 
    bottom: 0; 
    right: 10px; 
}
#TopBtn a {
    display: block; 
    text-decoration: none; 
    color: #fff; 
    background: #11116e;
    text-align: center; 
    border-radius: 5%; 
    outline: none; 
    padding:10px;
}
#TopBtn a:hover {
    text-decoration: none; 
    opacity:0.8;
}
.supporter-club { clear: both; }
.supporter-club img{
	display: block;
	margin: 20px auto;
}
address{font-style:normal;}
footer {
	border-top: 2px solid #11116e;	
	clear: both;
}
footer ul{ text-align: center;}
footer li{
	display: inline-block;
}
footer li a:hover{ color: #11116e;}
footer .guide li{ font-size: 0.9em;}
footer small{ 
	text-align: center;
	display: block;
}


.mincho{font-family: “游明朝”, YuMincho, “ヒラギノ明朝 ProN W3”, “Hiragino Mincho ProN”, “ＭＳ Ｐ明朝”, “ＭＳ 明朝”, serif;}
a{ 
	color:#0D0D0D;
	text-decoration: none;
}
a:hover{opacity: 0.8;}
p{margin: 0;}
ul{ padding: 0;}
li{ list-style: none;}

.clearfix{
	content: "";
    display: table;
    clear: both;
}
.link,.p-link{
	position: relative;
}
.link::afeter{
	position: absolute;
	content: "▼";
	transform: rotate( -90deg);
	-webkit-transform: rotate( -90deg);
}
.p-link::after{
	position: absolute;
	content: "▼";
}
img{ display: block;}	
table{
	border-collapse: collapse;
	border-spacing: 0;
}
.table-list { padding: 10px 15px;}
.table-list th{
	border-bottom: 2px solid #11116e;
	color: #11116e;
	vertical-align: middle;
	padding: 15px;
}
.table-list td{
	border-bottom: 2px solid #cccccc;
	padding: 15px;
}
.signature {
    display: block;
    text-align: right;
}
@media screen and (min-width: 769px) {
	.sp{ display: none;}
	body{
    min-width: 1080px;
	}
	.js-floating__inner{
    min-width: 1080px;
    max-width: 1280px;
	padding: 10px 0;
	}
	header .logo{ margin: 12px;}
	header address{ 
	position: absolute;
	top:15px;
	right:0;
	}
	header address h2{
	position: absolute;
	bottom: 0;
	right: 210px;
	}
	.header-btn li img{
	width: 25px;
	height: 25px;
	}
	.nav {
    min-width: 1020px;
    max-width: 1280px;
	}
	.nav-prim {
    font-size: 18px;
	}
	.nav-prim::before {
    display: inline-block;
	}
	.nav-secondary {
    width: calc(100% - 0px);
	padding: 15px;
	}   
	.nav-prim-li:hover > .nav-secondary {
    top: 50px;
    opacity: 1;
    pointer-events: auto;
    z-index: 100;
	transition-duration: 1000ms;
	transition-timing-function:ease-in-out;
	}
	.nav-cat-ttl::after { right: 15px;}
	.nav-cat-ttl:hover::after {	right: 5px;}
	h1:not(.logo){ font-size: 2.0em;}
	.col-3 { width: 33%;}
	.col-4 { width: 25%;}
	.col-5 { width: 20%;}
	.pkz ol{ 
		margin: 0 auto;
		width: 1200px;
	}
	h2{	font-size: 1.6em;}
	h2 span {
    font-size: 0.9em;
    margin-left: 20px;
	}
	h3{	font-size: 1.4em;}
	article{
	max-width: 1020px;
	}
	a.tel-namber{ 
	cursor: default;
        color: #0D0D0D !important;
        text-decoration: none !important;
	}
	footer .menu li{ margin: 0 20px 10px;}
	footer .guide li{ margin: 0 15px;}
}



@media screen and (max-width: 768px) {
	.pc { display: none;}
	.js-floating__inner {height: 100px;}
	.logo { width: 62%; margin: 20px 12px;}
	.logo img{ width: auto; max-width: 100%;}
	header address{ width: 32%; margin: 17px 0;}
	header address h2{ display: none;}
	.header-btn {margin: 0;}
	.header-btn li { padding: 8%; width: 15%;}
	.header-btn li img{
	width: 100%;
	height: 100%;
	}
	header .sns {
	right: 2%;
	top: 65%;
	}
	header .sns a.youtube{
	padding: 5px 10px 5px 30px;
	}
	.nav{ width: 100%;}
	.navi-check{ display: none;}
	.open + .nav-prim-li + .nav-secondary{
    opacity: 1;
    z-index: 100;
    transition-delay: 300ms !important;
    transition-duration: 300ms !important;
    box-sizing: border-box;
	}
	.open + .nav-prim-li:after{
    opacity: 1;
    bottom: -2px;
    z-index: 100;
    transition-delay: 300ms !important;
    transition-duration: 300ms !important;
	}
	.open + .nav-prim-li{ background: rgba(17,17,110,0.5);}
	.open + .nav-prim-li .nav-prim { color: #fff;}
	
	.nav-prim { font-size: 12px; height: 60px;}
	.nav-prim::before {
	display: block;
	margin: 0 auto;
	}
	.nav-prim-li:active > .nav-secondary {
    top: 52px;
    opacity: 1;
    pointer-events: auto;
    z-index: 100;
	transition-duration: 1000ms;
	transition-timing-function:ease-in-out;
	}
	.nav-secondary {
	padding: 10px 2%;
	top:60px;
	background: rgba(17,17,110,1);
	width: 100%;
	color: #ffffff;
	opacity:0;
	z-index: -1;  
    -webkit-transition: .0s;
    transition: .0s;
	pointer-events: auto !important;
    box-sizing: border-box;
	} 
	.nav-secondary.active{
    height:100%;
    visibility: visible;
    background:rgba(0,0,0,0.4);
    z-index:1000;
	}
	.nav-secondary a{ 
	color: #ffffff;
	display: inline-block;
	line-height: 2;
	}
	.nav-prim-li:active > .nav-secondary {
    top: 50px;
    opacity: 1;
    pointer-events: auto;
    z-index: 100;
	transition-duration: 1000ms;
	transition-timing-function:ease-in-out;
	}	
	.nav-cat-ttl::after { right: 20px;}
	.nav-cat-ttl:active::after {	right: 10px;}
	.pkz ol{ padding: 0 ; margin: 0;}
	h1:not(.logo){ font-size: 1.5em; text-align: center;}
	h2{	font-size: 1.3em;}
	h2 span {
    font-size: 0.8em;
    display: block;
	}
	h3{	font-size: 1.2em;}
	.col-4,.col-5 { width: 50%;}
	.col-3 { width: 100%;}
	article{max-width: 100%;}
	img { width: 100%;}
	.supporter-club img{ width: 50%;}
	footer .menu li{ margin: 0 10px 10px;}
	footer .guide li{ margin: 0 3px;}
}