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


/*--------------------------------------------------------------------------------------------
　　Topページ
--------------------------------------------------------------------------------------------*/
#top_main {
	width:100%;
}
#top_main .bg_wrap{
	width:100%;
	background:url("../images/top/main_img.jpg") no-repeat center top;
  max-width: 960px;
	background-size:100%;
	margin: 0 auto;
	position:relative;
}

#top_main .inner {
	background:linear-gradient( to bottom, rgba(255,255,255,0) 70%,  #fff );
	padding:300px 0 0 0;
	height:200px;
  position: relative;
}
@media (min-width: 960px){
  #top_main .inner:before{
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    background: linear-gradient( to left, rgba(255,255,255,0) 70%, #fff);
    width: 100px;
    height: 100%;
  }
    #top_main .inner:after{
    position: absolute;
    content: '';
    top: 0;
    right: 0;
    background: linear-gradient( to right, rgba(255,255,255,0) 70%, #fff);
    width: 100px;
    height: 100%;
  }
}
#top_main #nav_area{
  position: relative;
  z-index: 1000;
  
}

#main_copy {position:absolute; top:200px; left:38%;}

#top_main .bnr_area {margin:70px auto 0 auto; width:760px;}
#top_main .bnr_area img {margin-bottom: 20px;}

#top_contents {margin:0 auto 0 auto; width:760px; /*バナー３枚の時使用*//*padding-top: 220px;*/}
#top_contents .g_nav_sp {display:none;}
#top_contents .bnr_area {display:none;}

/*#top_contents .picup {margin-bottom:60px;}*/
#top_contents .picup {margin-bottom:20px;}
#top_contents .picup .item {width:100%;}
#top_contents .picup a {text-decoration:none;}
#top_contents .picup .item img { width: 40%; float:left;}
#top_contents .picup .text {width:60%; padding:45px 25px; float:left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
#top_contents .picup .item p {font-size:16px; line-height:1.6;}
#top_contents .picup .item p.title {color:#FFF; font-size:22px; font-weight:bold; letter-spacing:0.15em; margin-bottom:6px;}
#top_contents a:hover .text {-moz-opacity:0.8; opacity:0.8; filter:alpha(opacity=80);}
#top_contents .picup .item#p_message .text {background:#8FC232;}
#top_contents .picup .item#p_strengths .text {background:#F7B53E;}
#top_contents .picup .item#p_department .text {background:#2DA9DE;}
#top_contents .picup .item#p_department {margin-right:0;}

.bnr_results {margin-bottom: 60px;}

.division_area {background: #EEE; padding:50px 24px 16px 24px; margin-bottom: 20px;}
.division_area h2 {font-size: 26px; line-height: 1.2; text-align: center;}
.division_area h2 .blue {color:#008CD7;}
.division_area p.text {font-size: 14px; text-align: justify; line-height: 1.6; padding: 2%;}

.division_area a.btn_division {color: #FFF; background:#008CD7; font-size: 16px; font-weight: bold; text-align: center; display: block; max-width: 220px; padding: 16px; position: relative; text-decoration: none; margin: 30px auto 40px auto;}

.division_area a.btn_division:after {position: absolute;
  content: '';
  width: 8px;
  height: 8px;
  border: 0px;
  border-top: solid 1px #FFF;
  border-right: solid 1px #FFF;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  top: 50%;
  right: 10%;
  margin-top: 0;
}

.division_area ul.box a {text-decoration: none; position: relative; display: block; color: #CCC;}
.division_area ul.box a:before {position: absolute;
  content: '詳細';
  width: 36px;
  height: auto;
  border: solid 1px #AAA;
	padding: 4px 6px;
  top: 13%;
  right: 2%;
  margin-top: 0;
	font-size: 11px;
}
.division_area ul.box a:after {position: absolute;
  content: '';
  width: 4px;
  height: 4px;
  border: 0px;
  border-top: solid 1px #AAA;
  border-right: solid 1px #AAA;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  top: 22%;
  right: 3%;
  margin-top: 0;
}
.division_area ul.box a#kidsclub:before {color: #444;}
.division_area ul.box a#wakamatsu:before {color: #FFF; border-color: #FFF;}
.division_area ul.box a#wakamatsu:after {border-color: #FFF;}

.division_area ul.box li {display: flex; flex-wrap: wrap; background: #FFF; padding: 5px; margin-bottom: 12px;}
.division_area ul.box li#tyuju {background: #0B73B3;}
.division_area ul.box li#kouju {background: #004DA1;}
.division_area ul.box li#toshin {background: #008A7C;}
.division_area ul.box li#personal {background: #2C8054;}
.division_area ul.box li#red {background: #E05A36;}
.division_area ul.box li#kids {background: #F1E537;}
.division_area ul.box li#super_epion {background: #907544;}
.division_area ul.box li#epion {background: #3F9BC9;}
.division_area ul.box li#wakamatsu_kouju {background: #91b941;}
.division_area ul.box li#wakamatsu_personal {background: #609e49;}

.division_area ul.box li .logo_area {width: 33%; background: #FFF; padding: 1% 0; margin-right: 1.5%; text-align: center;}
.division_area ul.box li .logo_area img {width: 94%;}
.division_area ul.box li .inner {width: 64%; padding: 1% 0;}
.division_area ul.box li .inner p.explanation {font-size: 12px; text-align: justify; line-height: 1.2; color:#FFF;}

ul.box li dl.icon {border: solid 1px #FFF; display: inline-block; margin-bottom: 5px;}
ul.box li dl.icon dt, ul.box li dl.icon dd {padding: 5px 10px; display: inline-block; font-size: 12px; text-align: center; margin-bottom: 0;}
ul.box li dl.icon dt {background: #FFF; width: 88px; font-weight: bold;}
ul.box li dl.icon dd {width: 110px; font-weight: bold; color: #FFF;}

ul.box li#tyuju dl.icon dt {color: #0B73B3;}
ul.box li#kouju dl.icon dt {color: #004DA1;}
ul.box li#toshin dl.icon dt {color: #008A7C;}
ul.box li#personal dl.icon dt {color: #2C8054;}
ul.box li#red dl.icon dt {color: #E05A36;}
ul.box li#kids dl.icon dt {color: #EBA800; width: 88px; font-weight: bold;}
ul.box li#kids dl.icon dd {width: 110px; font-weight: bold; color:#443E23;}
ul.box li#super_epion dl.icon dt {color: #907544;}
ul.box li#epion dl.icon dt {color: #3F9BC9;}
ul.box li#kids .inner p.explanation {color:#000;}
ul.box li#epion dl.icon dt {color: #3F9BC9;}
ul.box li#kids .inner p.explanation {color:#000;}
ul.box li#wakamatsu_kouju dl.icon dt {color: #91b941;}
ul.box li#wakamatsu_personal dl.icon dt {color: #609e49;}

dl.other_area {border: solid 1px #CCC; margin-bottom: 20px;}
dl.other_area dt {background: #EEE; text-align: center; font-size: 14px; padding: 2%;}
dl.other_area dd {padding: 1% 5%; display: flex; flex-wrap: wrap;}
dl.other_area dd img {width: 34%; vertical-align: middle; margin-right: 2%;}
dl.other_area dd h3 {display: inline-block; padding: 1% 2%; font-size: 12px; border: solid 1px #333; vertical-align: middle; color: #000;}
dl.other_area dd p {display: inline-block; padding: 2%; font-size: 12px; width:50%; vertical-align: middle; line-height: 1.2;}

dl.other_area a {text-decoration: none; position: relative; display: block; color: #000;}
dl.other_area a:before {position: absolute;
  content: '詳細';
  width: 36px;
  height: auto;
  border: solid 1px #555;
	padding: 5px 6px;
  top: 24%;
  right: -2%;
  margin-top: 0;
	font-size: 11px;
}
dl.other_area a:after {position: absolute;
  content: '';
  width: 4px;
  height: 4px;
  border: 0px;
  border-top: solid 1px #333;
  border-right: solid 1px #333;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  top: 42%;
  right: -1%;
  margin-top: 0;
}
.mypage a{
	float: right;
	
}
.mypagefont{
	position:  relative;
	right: 0.3em; 
	top:0.3em;
	padding: 0.1em;
	border: solid 1px #ffffff;
}
.mypagefont_b{
	display:block;
	color:inherit;
	position:  relative;
	right: 0.3em; 
	top:0.3em;
	padding: 0.1em;
	border: solid 1px #000;
}

/*@media screen and (min-width:1301px){
#top_main {background-size:140%; background-position:-100px -200px;}
}

@media screen and (min-width:1500px){
#top_main {background-size:100%; background-position:0 -240px;}
}

@media screen and (max-width:1300px){
#top_main {background-size:120%; background-position:center -100px;}
#main_copy {position:absolute; left:auto; top:40%; right:20px;}	
}
@media screen and (max-width:1080px){
  #top_main .bg_wrap{
  background-size: 130%;
  }
}
@media screen and (max-width:1000px){
#top_main {background-size:150%; background-position:-240px -100px;}
#main_copy {position:absolute; top:40%; right:0;}	
}
*/
/*--------------------------------------------------------------------------------------------
　　タブレット・スマホ
--------------------------------------------------------------------------------------------*/
@media (max-width: 980px){
  #top_main .bg_wrap{
    height: 30%;
    /*background-size: cover;*/
    background-position: left 0px;
  }
  #top_main .inner{
    padding: 45% 0 0 0;
    height: 45%;
  }
	#main_copy {top:40%; right:0; left: 46%;}
	#main_copy img {width:100%;}
}

@media screen and (max-width:768px){	
#top_main {background-size:164%; background-position:-295px -110px;}
#top_main img {width:100%;}
#main_copy {top:120px; right:0; left:36%; width:60%;}
#top_main .bnr_area {width:90%;}
#top_contents {width:90%;}

#top_contents .picup .text {padding:5.3% 4%;}
	.bnr_results img {width: 100%;}
}

@media screen and (max-width:760px){
.bnr_results, .bnr_results img {width: 100%;}
}

@media screen and (max-width:740px){
#top_main #nav_area  {
	position: absolute;
	width: 100%;
	top:0;padding: 2% 0;
}
#top_main #nav_area .wrap {
	padding: 0; width:96%; 
}
#top_main .bg_wrap{ padding-top: 16%; background-position: center 40px; height: 200px;}
	
#top_main {
	width:100%;
	background-position:60% 10px;
	background-size:100%;
	padding:0;
	margin-bottom:0;
}
#top_main .inner {
	height:200px;
	padding:0;
}
#main_copy {top:60px; width:60%; left: 38%; right: 0;}
#top_main .bnr_area {margin:40px auto 0 auto;}

#top_contents {width:90%; /*padding-top: 330px;*/}
#top_contents .picup .item {width:32%; margin-right:2%;}
#top_contents .picup .item p.title {font-size:16px; letter-spacing:0;}
#top_contents .picup .text {height:auto; padding:4%;}
#top_contents .picup .text p {font-size:13px;}

#top_contents .picup a {text-decoration:none;}
#top_contents .picup .item {width:100%; float:none; margin:0 0 4% 0;}
#top_contents .picup .item#p_message {background:#8FC232;}
#top_contents .picup .item#p_strengths {background:#F7B53E;}
#top_contents .picup .item#p_department {background:#2DA9DE;}
#top_contents .picup .item img {width:40%; float:left;}
#top_contents .picup .item .text {width:54%; float:right;}
	.division_area {padding:26px 3% 1% 3%;}
	.division_area h2 {font-size: 22px;}
	.division_area a.btn_division {margin: 20px auto 30px auto;}
	.division_area a.btn_division:after {top: 43%;}
	.division_area ul.box li {display: block; padding: 3.5% 3.5% 12% 3.5%; margin-bottom: 6%; }
	.division_area ul.box li .logo_area {width: 100%; background: #FFF; padding: 1% 0; margin-right: 0;}
	.division_area ul.box li#red img {width: 80%;}
	.division_area ul.box li .inner {width: 100%;}
	
	ul.box li dl.icon {display: block; width: 100%; margin: 10px 0;}
	.division_area ul.box a {vertical-align: bottom;}
	.division_area ul.box a#kidsclub:before {color: #FFF;}
	.division_area ul.box a:before {
  content: '詳細を見る';
  width: 96%;
  height: 20px;
  border: none;
	background: #555;
	color: #FFF;
	padding: 6px 0 0 0;
  right: auto;
	top: 83%;
  left: 50%;
  transform: translateX(-50%);
  -webkit- transform: translateX(-50%);
	text-align: center;
	font-weight: bold;
	}
	.division_area ul.box a:after {
		border-top: solid 1px #CCC;
		border-right: solid 1px #CCC;
		top: 76%;
		right: 5%;
		margin-top: 26px;
	}
	
	ul.box li dl.icon {width: 99.4%;}
	ul.box li dl.icon dt, ul.box li#kids dl.icon dt, ul.box li dl.icon dd, ul.box li#kids dl.icon dd {width: 48%; padding: 4px 1%;}
	
	dl.other_area {display: block; margin-bottom: 100px;}
	dl.other_area dt {padding: 4%;}
	dl.other_area dd {padding-bottom: 10%;}
	dl.other_area dd a {text-align: center; width:100%;}
	dl.other_area dd img {width: 66%; margin: 5% auto; display: block;}
	dl.other_area dd h3 {display: block; text-align: center;}
	dl.other_area dd p {width: 100%; padding: 2% 0;}	
	dl.other_area a:before {
  content: '詳細を見る';
  width: 100%;
  height: 20px;
  border: none;
	background: #888;
	color: #FFF;
	padding: 6px 0 0 0;
  right: auto;
	top: 100%;
  left: 50%;
  transform: translateX(-50%);
  -webkit- transform: translateX(-50%);
	text-align: center;
	}
	dl.other_area a:after {
		border-top: solid 1px #CCC;
		border-right: solid 1px #CCC;
		 top: 89%;
		 right: 3%;	
		 margin-top: 26px;
	}
}/*-- 740 --*/


@media screen and (max-width:640px){
/*#top_main {
	background-size:160%; 
}
#top_main .inner {
	height:340px;
	
}
#main_copy {top:160px; width:70%;}*/
#top_contents {padding-top: 0;}
#top_contents .g_nav_sp {display:block; margin-bottom:6%;}
#top_contents .g_nav_sp li {float:left; border:1px solid #CCC; width:31.3%; margin:0 2% 2% 0;}
#top_contents .g_nav_sp li:nth-child(3n) {margin:0 0 2% 0;}
#top_contents .g_nav_sp li a {display:block; padding:50px 0 5px 0; text-decoration:none; font-size:11px; color:#000; text-align:center;}
#top_contents .g_nav_sp li.nav1 a {background:url(../images/common/nav_1.png) no-repeat center 5px;}
#top_contents .g_nav_sp li.nav2 a {background:url(../images/common/nav_2.png) no-repeat center 5px;}
#top_contents .g_nav_sp li.nav3 a {background:url(../images/common/nav_3.png) no-repeat center 5px;}
#top_contents .g_nav_sp li.nav4 a {background:url(../images/common/nav_4.png) no-repeat center 5px;}
#top_contents .g_nav_sp li.nav5 a {background:url(../images/common/nav_5.png) no-repeat center 5px;}
#top_contents .g_nav_sp li.nav6 a {background:url(../images/common/nav_6.png) no-repeat center 5px;}
/*#top_contents .group_list li a .text {padding:2%;}
#top_contents .group_list li a .mypagebtn {padding-bottom:8%;}*/
#top_main .bnr_area {display:none;}
#top_contents .bnr_area {display:block; /*margin-bottom:10%;*/}
#top_contents .bnr_area img {margin-bottom: 4%; width: 100%;}
#top_contents .picup .item {margin:0 0 6% 0;}
#top_contents .picup .item img {width:100%; float:none;}
#top_contents .picup .item .text {width:auto; float:none;}

/*#top_contents .group_list li {width:100%; float:none;}*/
#top_main .inner {
	height:180px;
	padding:0;
}
}/*-- 640 --*/