@charset "utf-8";

/* pc */
/******* Header *******/
#header_box{height: 125px; width: 100%; position: relative; z-index: 999;}
#logo{height: 120px; width: 160px; text-align: center; box-shadow: 0 0 8px; float: left; background: #FFF;}
#logo img{margin: 20px 0 0; height:auto; width:105px;}
h1{line-height: 70px; font-size: 18px; font-weight: bold; padding: 0 0 0 20px; float: left;}
#gmenu{ margin-left: 160px; min-width: 800px;  box-shadow: 4px 10px 8px -10px; height: 70px; position: relative; z-index: 99999;}
#gmenu ul{list-style: none; float: right; text-align: right; height: 70px; width:53%; margin: 0 2% 0 0;}
#gmenu ul li a{display: block; width: 25%; height: 70px; text-align: center; float: left; line-height: 70px; font-size: 14px; font-weight: bold; color: #000; text-decoration: none;}
#gmenu ul li a:hover,
#gmenu ul li a:focus,
#gmenu ul li.active a{
	background: #FADDEB;
}

#btn_entry{width: 85px; padding:0; float: right; margin: 20px 20px 0 0;}
#btn_entry a{ color: #FFF; font-weight: bold; display: block; width: 85px; padding: 2px 0 2px 20px; text-decoration: none; background:#41CAC0; transition: .3s;}
#btn_entry a:hover, #btn_entry a:focus{ background:#59CFA1;}

#sub_menu{
	margin-left: 160px;
	min-width: 800px;
	height: 50px;
	position: relative;
	background: #333;
}
#sub_menu ul{
	display: flex;
	list-style: none;
	height: 50px;
	margin: 0 0 0 20px;
}
#sub_menu ul li a{
	display: block;
	height: 50px;
	margin-right: 10px;
	padding: 0 10px;
	line-height: 50px;
	font-size: 13px;
	font-weight: bold;
	color: #FFF;
	text-align: center;
	text-decoration: none;
	transition: .3s;
}
#sub_menu ul li a:hover,
#sub_menu ul li a:focus,
#sub_menu ul li.active a{
	background:#FADDEB;
	color: #000;
}

/******* Footer *******/
#footer_box{background: #000; width: 100%; min-width: 960px; border-top: 1px solid #E7569A;}
#footer {
	display: flex;
	flex-wrap: wrap;
	width: 96%;
	margin: 0 auto;
	padding: 25px 0;
	color:#FFF;
}
#footer_address {
	width: 70%;
	margin-bottom: 10px;
}
#companyname {
	font-size: 15px;
	font-weight: bold;
	margin-bottom: 5px;
}
ul#btn_company {
	display: flex;
	justify-content: flex-end;
	width: 30%;
	margin: 10px 0;
	list-style: none;
}
ul#btn_company li a {
	text-align: center;
	width: 90px;
	display: block;
	color: #FFF;
	text-decoration: none;
	border: #FFF 1px solid;
	margin-right: 15px;
	transition: .3s;
}
ul#btn_company li a:hover,
ul#btn_company li a:focus{
	color: #FFF;
	text-decoration: none;
	border: #E7569A 1px solid;
	margin-right: 15px;
	background:#E7569A;
}

#copyright{width: 100%; padding:0; text-align:center; font-size: 10px; color: #DDD;}

.topBtn {position:fixed; bottom:20px; right:20px; display:block;}
.topBtn:hover {opacity:0.7;}

#btn_box{width: 960px; margin: 80px auto 80px;}
.button{list-style: none; width: 960px; margin: 0; display: flex; justify-content: center; }
.button li{display: block; width: 420px; margin: 0 10px; text-align: center; line-height: 60px;}
.button li a{display: block; color: #FFF; text-decoration: none; line-height: 60px; font-size: 24px; letter-spacing: 5px; border-radius: 6px;}
.button li#btn_mg a, .button li#btn_mg2 a{background:#0D006D; transition: .3s;}
.button li#btn_ct a{background:url(../images/arrow_entry.png) no-repeat 85% 50% #41CAC0; transition: .3s;}
.button li#btn_mg a:hover, .button li#btn_mg a:focus, .button li#btn_mg2 a:hover, .button li#btn_mg2 a:focus{background:#5665BA;}
.button li#btn_ct a:hover, .button li#btn_ct a:focus{background:url(../images/arrow_entry.png) no-repeat  85% 50% #59CFA1;}

/******* Page Navi *******/
#pagenavi{width: 96%; min-width: 960px; margin: 0 auto 40px;}
#preview{width:auto; height: 30px; display: block; float: left; background: url(../images/arrow_pagenav.png) no-repeat left bottom;}
#preview a{ display: block; padding: 0 0 0 30px; font-weight: bold; font-size: 15px; line-height: 30px; text-decoration: none;}
#next{width:auto; height: 30px; display: block; float: right; background: url(../images/arrow_pagenav.png) no-repeat right top;}
#next a{ display: block; padding: 0 30px 0 0; font-weight: bold; font-size: 15px; line-height: 30px; text-decoration: none;}

/******* layout *******/
.content_box{width: 960px; margin: 0 auto; padding: 0 10px;}

table.line{margin: 30px 0; width: 100%;}
table.line tr:nth-child(2n){background:#F5F5F5;}
table.line th{border-bottom: #DDD 1px solid; width: 200px; padding: 20px; font-size: 18px; letter-spacing: 5px; vertical-align: top;}
table.line td{border-bottom: #DDD 1px solid; padding: 20px; font-size: 14px;}

.pdd_b10{padding-bottom: 10px;}

/* smartPhone */
@media screen and (max-width: 640px) {
/******* Header *******/
#header_box{/*height: 80px;*/ width: 100%;}
#logo{height:40px; width:60px; text-align: center; box-shadow:none; float: left;}
#logo img{margin:3px 0 0; height:auto; width:50px;}
h1{line-height: 40px; font-size: 12px; padding: 0 10px 0 0; float: right;}
#gmenu{ margin-left:0; min-width:inherit; box-shadow: 0 2px 3px gray; height: 40px; clear: both; background: #FFF;}
#gmenu ul{ float:none; text-align: right; height: 40px; width:100%; margin: 0;}
/*#gmenu ul li a{width: 25%; height: 40px; line-height: 40px; font-size: 11px; border-right: #CCC 1px solid; border-top: #CCC 1px solid;}*/
#gmenu ul li a{width: 20%; height: 40px; line-height: 40px; font-size: 11px; border-right: #CCC 1px solid; border-top: #CCC 1px solid;}
#gmenu ul li a:hover, #gmenu ul li a:focus{background: none;}

#btn_entry{width: 20%; padding:0; float: right; margin:0;}
#btn_entry a{width:100%; padding:0; text-align: center; line-height: 40px; font-size: 11px;}

/*#sub_menu{display: none;}*/
#sub_menu{
	margin-left:0px;
	width: 100%;
	min-width:inherit;
	height:auto;
	padding: 5px 0;
	}
#sub_menu ul{
	list-style: none;
	height:auto;
	margin: 0;
}
#sub_menu ul li a{
	display: block;
	width:inherit;
	text-align:left;
	margin-right:0px;
	margin-left: 4px;
	height:auto;
	line-height:1.9em;
	font-size: 11px;
	padding: 1px 10px;
}
#sub_menu ul li a:hover,
#sub_menu ul li a:focus,
#sub_menu ul li.active a{
	border-radius: 10px;
}


/******* Footer *******/
#footer_box{min-width:inherit; clear: both;}
#footer{max-width:inherit; width: 96%; margin: 0 auto; color:#FFF; padding: 15px 0;}
#footer_address{width: 100%; margin-bottom: 5px; font-size: 11px; line-height: 1.5em;}
#companyname{font-size: 12px; margin-bottom: 5px;}
#companyname img{width: 25px; height: auto;}
ul#btn_company{
	justify-content: flex-start;
	width: 100%;
	margin: 10px 0 0;
}
ul#btn_company li a {
	width: auto;
	font-size: 11px;
	padding: 2px 10px;
	white-space: nowrap;
}
ul#btn_company li a:hover, ul#btn_company li a:focus{ margin-right: 5%;}
#copyright{clear: both; padding:10px 0 0; text-align:left;}

.topBtn {position:fixed; bottom:5px; right:5px; display:block;}

#btn_box{width:100%; margin:40px 0 40px;}
.button{ width:100%; padding: 0 10px;}
.button li{ width:45%; line-height: 40px;}
.button li a{ line-height: 40px; font-size: 18px; letter-spacing:1px;}
.button li#btn_ct a, .button li#btn_ct a:hover, .button li#btn_ct a:focus{ background-size: 14px; padding-right:25px}


/******* Page Navi *******/
#pagenavi{width:100%; min-width:inherit; margin: 0 auto 20px;}
#preview{ height: 24px; background-size:24px;}
#preview a{ padding: 0 0 0 24px; font-size: 13px; line-height: 24px;}
#next{ height: 24px; background-size:24px;}
#next a{padding: 0 24px 0 0; font-size: 13px; line-height: 24px;}

/******* layout *******/
.content_box{width: 100%; margin: 0; padding: 0;}

table.line{margin: 15px 0;}
table.line th{width:auto; padding: 10px 0 10px 10px; font-size: 12px; white-space: nowrap; letter-spacing:0;}
table.line td{padding: 10px; font-size: 12px;}

}