@charset "UTF-8";
@import "/include/css/common.sp.css";

/* ---------------------------------------------------------
	CSS Document slide
--------------------------------------------------------- */

#slide .flexslider {
	margin-bottom: 30px;
}

#slide .slides:after {
	background: #bbbaba;
}

#slide li.nth1 {
	background-image: url(../top/slide_01_sp.jpg);
	font-size: 12px;
}

#slide li.nth2 {
	background-image: url(../top/slide_02_sp.jpg);
}

#slide li.nth3 {
	background-image: url(../top/slide_03_sp.jpg);
}

#slide li.nth4 {
	background-image: url(../top/slide_04_sp.jpg);
}

#slide li.nth5 {
	background-image: url(../top/slide_05_sp.jpg);
}

#slide .slides li {
	padding: 220px 15px 20px 15px;
	background-position: top;
	background-color: #fff;
	background-repeat: no-repeat;
	background-size: auto 200px;
	text-align: left;
}

@media screen and (min-width: 2001px) {
#slide .slides li {
	background-size: 100% auto !important;
}
}

#slide .start li:first-child {
	opacity: 1 !important;
}

#slide .slides li .find {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	vertical-align: middle;
}

#slide .slides li .find:hover {
	opacity: 0.8;
	filter: Alpha(opacity=80);
}

#slide .slides li h2 {
	margin-bottom: 10px;
	font-weight: 100;
	font-size: 20px;
	line-height: 1.2;
}

#slide .slides li a {
	text-decoration: none;
	color: #333;
}

/* ---------------------------------------------------------
	CSS Document slide > 1-2-3
--------------------------------------------------------- */

.flex-control-nav {
	height: 6px;
	margin-top: 10px;
}

.flex-control-nav li {
	display: inline-block;
	vertical-align: top;
	margin: 0 4px;
	text-align: left;
}

.flex-control-nav a {
	display: block;
	vertical-align: top;
	width: 6px;
	height: 6px;
	overflow: hidden;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	background: #cbcbcb;
	line-height: 9px;
	text-indent: -99px;
	cursor: pointer;
}

.flex-control-nav a.flex-active {
	background: #0167b9;
}

/* ---------------------------------------------------------
	CSS Document slide > slide_bnr
--------------------------------------------------------- */

#slide_bnr .find {
	width: 75%;
	max-width:350px;
	margin:auto;
	padding-right: 12px;
	padding-left: 12px;
	padding-top: 12px;
	border-left:#d3d6d5 1px solid;
	border-right:#d3d6d5 1px solid;
	background: #fff;
	z-index: 3;
}

#slide_bnr .find:first-child {
	border-top:#d3d6d5 1px solid;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}

#slide_bnr .find:last-child {
	border-bottom:#d3d6d5 1px solid;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
	padding-bottom: 12px;
	margin-bottom:30px
}

/* ---------------------------------------------------------
	CSS Document enq_out
--------------------------------------------------------- */
#enq_out {
	background: #f0f1f5;
	padding:15px;
	margin-bottom:20px;
}

#enq_out .container {
	text-align: center;
}

#enq_out .container .pc {
	display:none
}

#enq_out .container p {
	margin-top:10px;
	padding-left:10px;
	text-align:left;
	border-left:5px solid #596eaf
}

/* ---------------------------------------------------------
	CSS Document news
--------------------------------------------------------- */

#hww_news_pickup li {
	vertical-align:top;
	font-size:14px;
	line-height:22px;
}

#hww_news_pickup h3 {
	display:block;
	font-size:16px;
	color:#5671bf;
	border-bottom: 3px solid #5671bf;
	padding:2%;
	margin-bottom:2%;
	text-align:left
}

div#hww_news {
	height: 512px;
	padding: 15px;
	overflow: scroll;
	border: 1px solid #CCC;
	text-align:left;
	margin-bottom:5%;
	overflow-x: hidden;
	-webkit-overflow-scrolling: touch;
}

#hww_news_pickup #hww_news ul {
	border-bottom: 1px solid #CCC;
	margin-bottom:2%;
	padding-bottom:2%;
}

#hww_news_pickup #hww_news ul li:nth-of-type(1),
#hww_news_pickup #pickup ul li:nth-of-type(1){
	text-align:center;
}

#hww_news_pickup #hww_news span {
	padding:2% 0;
	color:#a47456;
	font-weight:bold;
}

#hww_news_pickup #hww_news p {
	padding:2% 0;
	font-size:15px;
	color:#c04217;
	font-weight:bold;
}

#hww_news_pickup #hww_news .link {
	display:block;
	padding-top:15px;
	font-weight:normal;
}

#hww_news_pickup .youtube {
	position: relative;
	height: 0;
	margin:0 auto 3%;
	padding-top: 56.25%;
	overflow: hidden;
	margin:3%;
}

#hww_news_pickup .youtube iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

div#pickup {
	text-align:left;
	margin:3%;
}

#hww_news_pickup #pickup img {
	float:left;
	margin-right:15px
}

#hww_news_pickup #pickup a {
	display:flex;
	text-decoration:none;
	padding:5%;
	border:1px solid #ccc;
	border-radius:5px;
}

#hww_news_pickup #pickup a span {
	text-decoration:underline;
	display:block;
	margin-bottom:5px;
	color:#354f9e
}

#hww_news_pickup #pickup p {
	color:#333;
}

/*----
#hww_news_pickup #pickup span {
	padding:2px 8px;
	background:#c17343;
	color:#fff;
	font-size:11px;
}

#hww_news_pickup #pickup p {
	padding:3px 0;
}

#hww_news_pickup #pickup ul {
	border-top: 1px solid #CCC;
	padding:2%;
}

#hww_news_pickup #pickup ul:last-child{
	border-bottom: 1px solid #CCC;
}
--- */

/* ---------------------------------------------------------
	CSS Document movie_guideline
--------------------------------------------------------- */
#movie_guideline{
	background:#f1f1f1;
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
	margin:10% 0 0;
	padding:0 5% 8%;
	text-align:left;
}

#movie_guideline h2{
	position:relative;
	top:-20px;
	display:block;
	width:278px;
	height:42px;
	background:url(/include/top/movie_guideline_title_bk01.png) no-repeat;
	margin:auto;
	padding:8px 0 0 65px;
	font-size:17px;
	color:#3d559a;
}

#movie_guideline img{
	display:block;
	margin:auto;
	width:100%;
	max-width:390px;
}

#movie_guideline ul.index01{
	display:block;
}

#movie_guideline h3{
	position:relative;
	margin:5% 0;
	background:#d4dffb;
	font-size:18px;
	line-height:25px;
	font-weight:normal;
	box-shadow: 3px 3px #42599b;
}

#movie_guideline h3 a{
	display:block;
	padding:5% 30px 5% 5%;
	color:#333;
	text-decoration:none;
}

#movie_guideline h3 br{
	display:none
}

#movie_guideline h3 a::after{
	position:absolute;
	content:url(/include/top/movie_guideline_allow01.png);
	transform:translateY(-50%);
	top:50%;
	right:15px;
}

#movie_guideline h3 a:hover{
	color:#333;
	opacity: 0.8;
}

#movie_guideline li.obj01{
	width:60px;
	background:#42599b;
	border-radius:50px;
	padding-top:2px;
	color:#fff;
	text-align:center;
}

#movie_guideline li.obj02{
	display:block;
	padding-top:5px;
	text-indent:-1em;
	margin-left:1em;
}

#movie_guideline ul.link01{
	display:block;
	margin-top:3%
}

#movie_guideline ul.link01 li:nth-child(1){
	display:block;
	background:#42599b;
	border:2px solid #42599b;
	padding:10px;
	font-size:15px;
	line-height:1.2;
	color:#fff;
}

#movie_guideline ul.link01 li:nth-child(2){
	position:relative;
	display:block;
	background:#fff;
	border:2px solid #42599b;
	font-size:16px;
	line-height:1.2;
}

#movie_guideline ul.link01 li a{
	display:block;
	padding:10px;
	color:#333;
	text-decoration:none;
}

#movie_guideline ul.link01 li a::after{
	position:absolute;
	content:url(/include/top/movie_guideline_allow01.png);
	transform:scale(0.8) translateY(-50%);
	top:50%;
	right:5px;
}

#movie_guideline ul.link01 li a:hover{
	background:#eef2fd;
	color:#333;
	opacity: 0.8;
}

/* ---------------------------------------------------------
	CSS Document hacchu
--------------------------------------------------------- */

#hacchu {
	width:100%;
	text-align:left;
}

#hacchu h2 {
	background: #10b1bf;
	padding:3% 0 2%;
	text-align:center;
	font-size:20px;
	color:#fff;
	border-bottom:15px solid #65dee9
}

#hacchu .text01 {
	display:block;
	padding:3% 5% 0;
	background: #aeeef4;
	font-weight:bold;
	line-height:22px;
	color:#0a383c;
}

#hacchu .hacchu_link {
	background: #aeeef4;
	padding:2% 2% 3%;
}

#hacchu .hacchu_link .s1 {
	color: #0a383c;
	font-size: 15px;
	display: flex;
	align-items: center;
	margin-bottom:3px
}

#hacchu .hacchu_link .s1:before, .s1:after {
	content: "";
	flex-grow: 1;
	height: 1px;
	background: #0a383c;
	display: block;
}

#hacchu .hacchu_link .s1:before {
	margin-right: .4em;
}

#hacchu .hacchu_link .s1:after {
	margin-left: .4em;
}

#hacchu .hacchu_link .list a {
	display:block;
	margin-bottom:15px;
	padding:5px;
	background: #10b1bf;
	background-repeat: no-repeat;
	background-position:13px 11px;
	border-radius:20px;
	text-decoration:none;
	color:#fff;
	font-size:18px;
	line-height:20px;
	font-weight:bold;
	position: relative;
	text-align:center;
}

#hacchu .hacchu_link .list a span {
	display:inline-block;
	background: url(../top/mk_hachu02.png) ;
	background-repeat: no-repeat;
	background-position:0 3px;
	padding:5px 0 5px 33px
}


#hacchu .hacchu_link ul li a {
	display:block;
	margin-bottom:5px;
	padding:7px 25px 5px;
	line-height:20px;
	background: url(../top/mk_hachu01.png) #fff;
	background-repeat: no-repeat;
	background-position:13px 11px;
	border-radius:20px;
	text-decoration:none;
	color:#0a383c;
	font-weight:bold;
	border:1px solid #10b1bf
}

#hacchu .hacchu_link ul li a:hover {
	background: url(../top/mk_hachu01.png) #e3f9fb;
	background-repeat: no-repeat;
	background-position:13px 11px;
}


/* ---------------------------------------------------------
	CSS Document worker
--------------------------------------------------------- */

#worker {
	width:100%;
	text-align:left;
}

#worker h2 {
	background: #f57474;
	padding:3% 0 2%;
	text-align:center;
	font-size:20px;
	color:#fff;
	border-bottom:15px solid #fcb0b0
}

#worker .text01 {
	display:block;
	padding:3% 5% 0;
	background: #ffcece;
	font-weight:bold;
	line-height:22px;
	color:#402020;
}

#worker .worker_link {
	background: #ffcece;
	padding:2% 2% 3%;
}

#worker .worker_link .s1 {
	color: #402020;
	font-size: 15px;
	display: flex;
	align-items: center;
	margin-bottom:3px
}

#worker .worker_link .s1:before, .s1:after {
	content: "";
	flex-grow: 1;
	height: 1px;
	background: #402020;
	display: block;
}

#worker .worker_link .s1:before {
	margin-right: .4em;
}

#worker .worker_link .s1:after {
	margin-left: .4em;
}

#worker .worker_link .list a {
	display:block;
	margin-bottom:15px;
	padding:5px;
	background: #f57474;
	background-repeat: no-repeat;
	background-position:13px 11px;
	border-radius:20px;
	text-decoration:none;
	color:#fff;
	font-size:18px;
	line-height:20px;
	font-weight:bold;
	position: relative;
	text-align:center;
}

#worker .worker_link .list a span {
	display:inline-block;
	background: url(../top/mk_worker02.png) ;
	background-repeat: no-repeat;
	background-position:0 3px;
	padding:5px 0 5px 33px
}


#worker .worker_link ul li a {
	display:block;
	margin-bottom:5px;
	padding:7px 25px 5px;
	line-height:20px;
	background: url(../top/mk_worker01.png) #fff;
	background-repeat: no-repeat;
	background-position:13px 11px;
	border-radius:20px;
	text-decoration:none;
	color:#402020;
	font-weight:bold;
	border:1px solid #f57474
}

#worker .worker_link ul li a:hover {
	background: url(../top/mk_worker01.png) #fff1f1;
	background-repeat: no-repeat;
	background-position:13px 11px;
}


/* ---------------------------------------------------------
	CSS Document cnavi
--------------------------------------------------------- */

#cnavi {
	margin-bottom: 40px;
}

#cnavi .box {
	display: inline;
}

#cnavi dl {
	display: inline-block;
	vertical-align: top;
	width: 42%;
	margin-top: 40px;
	background-repeat: no-repeat;
	background-position: center 50px;
	background-size: auto 130px;
}

#cnavi .nth1 {
	margin-right: 5%;
	background-image: url(../top/cnavi_01.png);
}

#cnavi .nth2 {
	background-image: url(../top/cnavi_02.png);
}

#cnavi .nth3 {
	margin-right: 5%;
	background-image: url(../top/cnavi_03.png);
}

#cnavi .nth4 {
	padding-top: 0;
	background-image: url(../top/cnavi_04.png);
}

#cnavi .nth5 {
	margin-right: 5%;
	background-image: url(../top/cnavi_05.png);
}

#cnavi .nth6 {
	background-image: url(../top/cnavi_06.png);
}

#cnavi dl:hover {
	opacity: 0.8;
	filter: Alpha(opacity=80);
}

#cnavi dt {
	height: 190px;
	font-size: 18px;
	line-height: 1.2;
}

#cnavi dt span {
	color: #fd6d15;
}

#cnavi dd {
	text-align: left;
	font-size: 13px;
}

#cnavi dd a {
	text-decoration: none;
	color: #333;
}

/* ---------------------------------------------------------
	CSS Document osusume
--------------------------------------------------------- */

#osusume {
	margin-bottom: 20px;
	padding: 20px 15px;
	background: #e9eefc;
	text-align: left;
}

#osusume h2 {
	margin-bottom: 15px;
	padding-left: 50px;
	background: url(../top/osusume_01.png) no-repeat 0 0;
	background-size: auto 22px;
	font-size: 20px;
	line-height: 26px;
}

#osusume p a {
	display: inline-block;
	vertical-align: middle;
	padding: 5px 0;
	font-size: 14px;
}

#osusume .iframe {
	height: 0;
	overflow: hidden;
	margin-top: 10px;
	padding-bottom: 40%;
	padding-top: 50px;
	border-top: solid 2px #000;
	border-bottom: solid 1px #ccc;
	position: relative;
}

#osusume .iframe iframe {
	vertical-align: top;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	border: 0;
}

/* ---------------------------------------------------------
	CSS Document sns_window
--------------------------------------------------------- */
#sns_window {
	margin:0 0 40px
}

#sns_window ul li:first-child {
	display:inline-block;
	padding:5%;
	width:100%;
}

#sns_window ul li:last-child {
	display:inline-block;
	padding:5%;
	width:100%;
}

/* ---------------------------------------------------------
	CSS Document news
--------------------------------------------------------- */

#news h2 {
	border-bottom: solid 2px #7f8eba;
	font-weight: 100;
	font-size: 20px;
}

#news dl {
	margin: 15px;
	text-align: left;
}

#news dt {
	color: #fd6d16;
}

/* ---------------------------------------------------------
	CSS Document news > btn
--------------------------------------------------------- */

#news .btn li {
	display: inline-block;
	*display: inline;
	*zoom: 1;
	vertical-align: top;
}

#news .btn a {
	display: block;
	height: 48px;
	padding: 0 40px 0 20px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	border: solid 1px #ccc;
	background: #f0f0f0;
	background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f0f0f0));
	background: -moz-linear-gradient(top, #ffffff, #f0f0f0);
	background: linear-gradient(to bottom, #ffffff, #f0f0f0);
	background: -ms-linear-gradient(top, #ffffff, #f0f0f0);
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f0f0f0', GradientType=0)";
	text-decoration: none;
	line-height: 48px;
	color: #333;
	position: relative;
}

#news .btn a:before {
	content: '';
	width: 7px;
	height: 7px;
	margin-top: -5px;
	border-top: solid 2px #333;
	border-right: solid 2px #333;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	position: absolute;
	top: 50%;
	right: 20px;
}

#news .btn a:hover {
	opacity: 0.8;
	filter: Alpha(opacity=80);
}

/* ---------------------------------------------------------
	CSS Document news_line
--------------------------------------------------------- */

#news_line h3{
	margin:5% 5% 3%;
	border-bottom:5px solid #3d559a;
	color:#3d559a;
}

#news_line ul {
	padding-bottom:5%;
}

#news_line ul li{
	margin:2% 5%;
	padding-bottom:15px;
	border-bottom:1px dotted #333;
	text-align:left
}

#news_line ul li span,#news ul li p{
	display:inline-block;
	vertical-align:top
}

/* ---------------------------------------------------------
	CSS Document e-learnig
--------------------------------------------------------- */

#e-learnig{
	width:100%;
	background:#ecf1fe;
}

#e-learnig h3{
	color:#3d559a;
	border-bottom:#3d559a solid 5px;
	text-align:center;
	margin-bottom:5%;
	padding-bottom:2%
}

#e-learnig ul{
	text-align:left;
	margin:auto;
	padding:5%
}

#e-learnig ul li:nth-child(2){
	text-align:center;
	padding-bottom:2%
}

#e-learnig ul .e-learnig_il{
	margin-top:5%;
}

#e-learnig ul .e-learnig_il img{
	margin:-10px 10px 0 0;
	float:left;
}

#e-learnig ul .e-learnig_il p{
	margin-bottom:2%;
	width:100%;
	min-height:124px
}

#e-learnig ul .e-learnig_il span{
	font-size:14px;
	line-height:24px;
}

#e-learnig a{
	color:#333;
	text-decoration:none;
}

#e-learnig a:hover{
	opacity: 0.8;
	filter: Alpha(opacity=80);
}

#e-learnig .e-learning_bt span{
	display:block;
	width:100%;
	background:#fff url('../top/e-learning_05.png')  no-repeat 15% 25px;
	padding:2% 5%;
	border:3px #b9c6da solid;
	text-align:center
}
#e-learnig_chapter{
	width:100%;
	background:#bbc9ed
}

#e-learnig_chapter ul{
	width:100%;
	text-align:center;
	margin:auto;
	padding:5% 0
}

#e-learnig_chapter li{
	display:inline-block;
	width:230px;
	margin:2%;
	background:#fff url('../top/e-learning_04.png') no-repeat 206px 152px;
	text-align:left;
}

#e-learnig_chapter a{
	color:#333
}

#e-learnig_chapter a:hover{
	opacity: 0.9;
	filter: Alpha(opacity=90);
}

#e-learnig_chapter ul li p{
	padding:5px 12px
}

#e-learnig_chapter ul li strong{
	color:#3d559a
}