@charset "UTF-8";
.hide-onload {
	display: none !important;
}
body {
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	margin:0;
	padding: 0;
	background: #fff;
	font-size:18px;
}
.section {
	min-width: 1000px;
	margin: 0 auto;
	z-index:10;
}
* a {
	background:none;
	}
.section .body {
	width: 1000px;
	margin: 0 auto;
}
@media screen and (min-width: 960px){
.section {
	padding: 61px 0 75px;
}
.sp_br {
	display:none;
	}
#wrapperArea {
	padding-top:;
}
}
@media screen and (max-width: 959px){
.sp_br {
	display:block;
	}
body {
	font-family: "Hiragino Kaku Gothic ProN","メイリオ", sans-serif;
	min-width: 100%;
	padding: 0;
	}
#wrapperArea,
.section .body {
	width:100%!important;
	overflow: hidden!important;
	}
#wrapperArea {
}
}
/* keyvisual
-------------------------------------------------- */
.keyvisual,
.chartSecond .keyvisual {
	background: url(/firstguide/chart/images/key_bg.jpg) repeat!important;
	display:block!important;
	}
.keyvisual .body,
.chartSecond .keyvisual .body {
	position:relative;
	margin:0 auto;
	}
.keyvisual .illust img,
.keyvisual h1 img,
.chartSecond .keyvisual .illust img,
.chartSecond .keyvisual h1 img {
	width:100%;
	height:auto;
}
@media screen and (min-width: 960px){
.keyvisual .body,
.chartSecond .keyvisual .body {
	width:1000px;
	}
.keyvisual {
	height:320px!important;
	}
.chartSecond .keyvisual {
	height:175px!important;
	}
.keyvisual p,
.keyvisual h1,
.chartSecond .keyvisual p,
.chartSecond .keyvisual h1 {
	position:absolute;
	}
.keyvisual .illust {
	width:235px;
	left:20px;
	top:8px;
	}
.chartSecond .keyvisual .illust {
	width:105px;
	left:145px;
	top:25px;
	}
.keyvisual h1 {
	width:675px;
	left:275px;
	top:62px;
	}
.chartSecond .keyvisual h1 {
	width:550px;
	left:275px;
	top:15px;
	}
}
@media screen and (max-width: 959px){
.keyvisual,
.chartSecond .keyvisual {
	height:auto!important;
}
.keyvisual .body,
.chartSecond .keyvisual .body {
	width:100%;
	height:auto;
	}
.keyvisual p,
.keyvisual h1,
.chartSecond .keyvisual p,
.chartSecond .keyvisual h1 {
	position:relative;
	}
.keyvisual .body,
.chartSecond .keyvisual .body {
	width:96%;
	margin:0 auto;
	padding:4.2% 0 2%;
	}
.keyvisual .illust,
.chartSecond .keyvisual .illust {
	float:left;
	margin:0!important;
}
.keyvisual .illust {
	width:20%;
}
.chartSecond .keyvisual .illust {
	width:20%;
}
.keyvisual h1,
.chartSecond .keyvisual h1 {
	float:left;
}
.keyvisual h1 {
	width:78%;
	margin-left:2%;
	margin-top:1%;
}
.chartSecond .keyvisual h1 {
	width:76%;
	margin-left:4%;
}
}
/* contents
-------------------------------------------------- */
a.overwhite{
	background-color:#fff;
	background:none!important;
	display:block;
}
a.overwhite:hover img{
	cursor:pointer;
	transition:all 0.5s ease;
	filter: alpha(opacity=70);		/* ie lt 8 */
	-ms-filter: "alpha(opacity=70)";  /* ie 8 */
	-moz-opacity:0.7;				 /* FF lt 1.5, Netscape */
	-khtml-opacity: 0.7;			  /* Safari 1.x */
	opacity:0.7;
	zoom:1;
}

/*main
-------------------------------------------------- */
#main p img {
	width:100%;
	height:auto;	
	}
#main .text {
	margin:0 auto;
	}
#main .btnAreaTwo {
	display:flex;
	}
/*ul.btn2 li a:before {
	content: "";
	width: 0px;
	height: 0px;
	margin: 0;
	overflow: hidden;
	background: none;
}*/
@media screen and (min-width: 960px){
#main {
	margin:85px auto;
	}
.chartSecond #main {
	margin:30px auto;
	}
#main .text {
	width:800px;
	}
#main .btnArea {
	margin:75px auto 0;
	padding-bottom:30px;
	}
#main .btnAreaTwo {
	width:795px;
	margin:30px auto 0;
	padding-bottom:30px;
	}
#main .btnAreaTwo .btnYes {
	margin-right:75px;
	}
}
@media screen and (max-width: 959px){
#main {
	margin:1.5% auto;
	}
.chartSecond #main {
	margin:2% auto 10%;
	}
#main .text {
	width:100%;
	}
#main .btnArea {
	margin:6% auto 0;
	padding-bottom:8%;
	}
#main .btnAreaTwo .btnYes {
	margin-right:2%;
	}
ul.btn2 {
	margin-bottom: 0;
 }
}
#main .greyAround {
	background:#eee;
	}

#main .greyAround h2 img {
	width:100%;
	height:auto;
	}
#main .kekka {
	background:#fff;
	}
#main .kekka .sakuhin {
	padding:0;
	}

#main .kekka .lm {
	background:#00135a;
	}
#main .kekka .pha {
	background:#2c273b;
	}
#main .kekka .cats {
	background:#081930;
	}
#main .kekka .ald {
	background:#310057;
	}
#main .kekka .hnd {
	background:#071b46;
	}
#main .kekka .lk {
	background:#f4be00;
	}
#main .kekka div {
	height:auto;
	margin:0 auto;
	}
#main .kekka img {
	width:100%;
	height:auto;
	margin:0;
	padding:0;
	}
#main .kekka img.visual {
	height:auto;
	margin:0;
	padding:0;
	}
#main .greyAround +ul.btn li.btnTypeHome a span {
	 padding:0;
 }

#main .btnAreaTwo +  ul.btn2 li a:before,
#main .greyAround +ul.btn li.btnTypeHome a span:before {
	content: "";
	width: 0;
	height: 0;
	display: none;
}
@media screen and (min-width: 960px){
#main .btnAreaTwo +  ul.btn2 li a {
	padding-left:0;
	}
#main .btnArea .btnStart {
	width:456px;
	height:auto;
	margin:0 auto;
	}
#main .greyAround + ul.btn li,
#main .greyAround + ul.btn li.btnTypeHome a {
	width: 560px;
}
ul.btnSingle li {
	width: 560px;
}
#main .greyAround {
	width:1000px;
	margin:0 auto;
	padding:50px 40px 40px;
	}
#main .greyAround h2 {
	width:375px;
	margin:0 auto 45px;
	height:auto;
}
#main .kekka {
	width:920px;
	padding:30px;
	}
#main .kekka div {
	width:500px;
	padding:20px 0;
	}
#main .kekka .sakuhin {
	width:860px;
	margin:0 0 30px 0;
	}
#main .kekka img.visual {
	width:860px;
	}
#main .kekka + h2 {
	margin-top:40px;
	margin-bottom:0;
	}
}
@media screen and (max-width: 959px){
#main .btnAreaTwo +  ul.btn2 li a {
	text-align:center;
	background-image:none;
	}
#main .btnArea .btnStart {
	width:80%;
	height:auto;
	margin:3% auto 4%;
	}
#main {
	width:100%;
	}
#main .body .text {
	width:96%;
	margin:0 auto 5%;
	}
ul.btn li.btnTypeHome a {
	width: 100%;
	padding: 12px 0 10px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	font-size: 12px;
	font-size: 1.2rem;
}
#main .greyAround {
	width:100%;
	padding:10% 2% 2%;
	}
#main .greyAround h2 {
	width:65%;
	margin:0 auto 10%;
	height:auto;
}
#main .kekka {
	width:100%;
	padding:2%;
	}
#main .kekka div {
	width:95%;
	padding:3% 0;
	}
#main .kekka .sakuhin {
	width:100%;
	margin:0 0 3% 0;
	}
#main .kekka img.visual {
	width:100%;
	}
#main .kekka p {
	width:98%;
	margin:0 auto;
	font-size:1.4rem;
	}
#main .kekka + h2 {
	margin-top:5%;
	margin-bottom:0;
	}
#main .greyAround + ul.btn {
	margin:5% 0 10%!important;
	}

}


/* sns
-------------------------------------------------- */
@media screen and (min-width: 960px){
#sns {
	width:920px;
	padding: 20px 0 30px;
	margin:0 auto;
}

#sns .body {
	width:920px;
}
}
@media screen and (max-width: 959px){
#sns {
	width:100%;
	padding: 2% 0 3%;
}

#sns .body {
	width:100%;
}
}
/* twoColumnsType
-------------------------------------------------- */
.twoColumnsType {
	width: 920px;
	margin: 0 0 28px;
	padding: 0;
}

.twoColumnsType .column {
	float: left;
}

.twoColumnsType .columnEnd {
	float: right;
}

/* threeColumnsType2
-------------------------------------------------- */
.threeColumnsType2 {
	margin: 0 auto;
	padding: 0;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
}

.threeColumnsType2 {
	width: 600px;
}
.chartSecond .threeColumnsType2 {
	width: 920px;
}

.threeColumnsType2 .column,
.threeColumnsType2 .columnEnd {
	margin: 0px;
}

.threeColumnsType2 .column a,
.threeColumnsType2 .columnEnd a {
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
	border-radius: 7px; 
	background-color: #ededed;
	color: #333333;
	text-decoration: none;
}

.threeColumnsType2 .column a,
.threeColumnsType2 .columnEnd a {
	text-decoration: none;
}

.threeColumnsType2 .column img,
.threeColumnsType2 .columnEnd img {
	text-align:center;
}
@media screen and (min-width: 960px){
.threeColumnsType2 {
	width: 920px;
}

.threeColumnsType2 .column {
	margin-right:10px;
}
.threeColumnsType2 .column,
.threeColumnsType2 .columnEnd {
	width: 300px;
}
.threeColumnsType2 .column .image,
.threeColumnsType2 .columnEnd .image {
	width: 78px;
	padding: 10px;
	box-sizing: border-box;
	text-align:center;
}
.threeColumnsType2 .table .table-cell.txt {
	font-size: 18px;
	font-weight: bold;
	padding:0;
}
}
@media screen and (max-width: 959px){
.threeColumnsType2 {
	width: 60%;
	margin:0 auto;
}

.threeColumnsType2 .column {
	margin-right:6%;
}
.threeColumnsType2 .column,
.threeColumnsType2 .columnEnd {
	width: 100%;
}
.threeColumnsType2 .column .image,
.threeColumnsType2 .columnEnd .image {
	width: 100%;
	height:auto;
	padding: 14% 2%!important;
	box-sizing: border-box;
	text-align:center;
}
.threeColumnsType2 .table .table-cell.txt {
	display:none;
}

.chartSecond .threeColumnsType2 {
	width: 100%;
}
.chartSecond .threeColumnsType2 .column,
.chartSecond .threeColumnsType2 .columnEnd {
	width: 33%;
}
.chartSecond .threeColumnsType2 .column .image,
.chartSecond .threeColumnsType2 .columnEnd .image {
	width: 78px;
	height:auto;
	text-align:center;
	padding: 10px;
	box-sizing: border-box;
}
.threeColumnsType2 .table .table-cell.txt {
	display:none;
}
}
/* generalTable
-------------------------------------------------- */
.generalTable table {
	width: 100%;
	padding: 0px;
	margin: 30px 0;
	font-size: 100%;
	border-bottom: 1px solid #d9d9d9;
	border-collapse: separate;
}

.generalTable table thead th {
	padding: 15px 0 13px;
	font-size: 187.5%;
	line-height: 1;
	color: #ffffff;
	text-align: center;
	border: none;
	border-top: 1px solid #d9d9d9;
	background: #666666;
	vertical-align: bottom;
	font-weight: bold;
	position: relative;
}

.generalTable table thead th span {
	padding: 0 0 0 27px;
}

.generalTable table thead th span.map1 {
	background: url(/firstguide/chart/images/map_1.png) left 4px no-repeat;
	background-size: auto 25px;
}

.generalTable table thead th span.map2 {
	background: url(/firstguide/chart/images/map_2.png) left 4px no-repeat;
	background-size: auto 25px;
}

.generalTable table thead th small {
	font-size: 66%;
	text-align: right;
	display: inline-block;
	font-weight: normal;
	position: absolute;
	bottom: 10px;
	right: 9px;
}

.generalTable table tbody {
	font-size: 140.625%;
	line-height: 1.222;
	color: #666666;
	text-align: left;
}

.generalTable table tbody th {
	width: 183px;
	padding: 12px;
	border: none;
	border-right: 1px solid #fbfbfb;
	border-top: 1px solid #d9d9d9;
	background: #f8f8f8;
	vertical-align: middle;
	box-sizing: border-box;
}

.generalTable table td {
	padding: 12px 12px 9px;
	border: none;
	border-top: 1px solid #d9d9d9;
	background: #ffffff;
	vertical-align: top;
}

.generalTable table td small {
	margin-top: 16px;
	font-size: 100%;
	display: block;
}

/* table
-------------------------------------------------- */
.table {
	width: 100%;
	display: table;
	table-layout: fixed;
}

.table .table-cell {
	display: table-cell;
	vertical-align: middle;
	text-align: left;
}

/* hidden
-------------------------------------------------- */
.hidden {
	display: none;
}

/* footer
-------------------------------------------------- */
#footer {
	width: 100%;
	height:100%;
	padding: 0px;
	margin: 0 auto;
	text-align: left;
}

#footer .footerLayout {
	width: 960px;
	height: 35px;
	padding: 30px 0px 50px;
	margin: 0 auto 0;
}

/* lines
-------------------------------------------------- */
.lines-on-sides {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	text-align: center; /* for no-flexbox browsers */
}
.lines-on-sides:after,
.lines-on-sides:before{
	border-top: 1px solid #d2f7f2;
	content: "";
	display: inline; /* for IE */
	-webkit-box-flex: 1;
	-webkit-flex-grow: 1;
	-ms-flex: 1;
	flex-grow: 1;
}
.lines-on-sides:after {
	margin-left: 1em;
}
.lines-on-sides:before {
	margin-right: 1em;
}

/* pageTop
-------------------------------------------------- */
#pageTop {
	padding: 0;
	margin: 0;
	border-top: 1px solid #cccccc;
	background:#fff;
}

#pageTop a {
	width: 100%;
	margin:0 auto;
	padding: 52px 0 13px;
	font-size: 10px;
	font-size: 1rem;
	color: #000000;
	text-align: center;
	display: block;
	background: url(/toppage/images/btn_pagetop_1.png) center 23px no-repeat;
}

#pageTop a:hover {
	color: #c3303c;
	text-decoration: none;
	background: #f3dddf url(/toppage/images/btn_pagetop_1_hover.png) center 23px no-repeat;
}


/*topbtn
-------------------------------------------------- */
@media screen and (max-width: 959px){
	#pageTop {
		padding: 0;
		margin: 0;
		border-top: 1px solid #cccccc;
	}

	#pageTop a,
	#pageTop a:hover {
		padding: 60px 0 13px;
		font-size: 240%;
		color: #000000;
		background: url(/toppage/images/btn_pagetop_1.png) center 16px no-repeat;
		background-size: auto 24px;
	}

}