@charset "utf-8";

/* トップページ

■□■□■□■□■□■□■□■□■□■□■□■□■□■□■□■□■□■□
-----------------------------------------------------------------------*/

	/********************************************
	 * お客様へお知らせ
	 ********************************************/
	.topNotice{ margin:0;padding:0; color:#254F65;padding:15px; box-sizing: border-box;}
	.topNotice>h2{ padding:15px; box-sizing: border-box; text-align:center;}
	.topNotice .box { border-bottom:1px dotted #555;color:#555; border-left:1px solid #555;}
	.topNotice .box h3{ padding:5px 0 10px 15px; box-sizing: border-box; font-size:14px; line-height:1.6;text-decoration:underline; font-weight:normal;}
	.topNotice .box p{ padding:10px 0 0 15px; box-sizing: border-box;  font-size:14px;}
	.topNotice .box a{display:block;}
	.topNotice .box a:hover{background:#F1F1F1;}
@media(max-width:991px) {
	.topNotice .box { border-left:none;}
}
	/********************************************
	 * トップスライダー
	 ********************************************/
	#indexIntro { position: relative; z-index: 2; background-color: #000; margin:34px 0 0 0; padding: 0; min-height: 240px; padding-bottom: 1px; margin-left: auto; margin-right: auto;}
	#indexIntroStage { margin-left: auto; margin-right: auto;}
	#indexIntroStage .slicker.has-dot { padding-bottom: 0;}
	#indexIntroStage .slicker.has-dot>.slicker-view.fade { bottom: 0;}
	/* ページャー */
	#indexIntro .slicker-dots { bottom: 30px;}
	#indexIntro .for_mobile .slicker-dots { bottom: 4px;}
	/* スライダー下部　ボタン */
	.fixedSkip { display: none; position: absolute; left: 50%; bottom: -30px; margin-left: -30px; width: 60px; height: 60px; -webkit-border-radius: 30px; -moz-border-radius: 30px; -ms-border-radius: 30px; border-radius: 30px; background-color: #000; background-color: rgba(0,0,0,0.5); white-space: nowrap; text-indent: 100%; overflow: hidden; color: #fff; z-index: 1; clip: rect(0px,60px,30px,0);}
	.fixedSkip:before { text-decoration: none!important; display: block; text-align: center; line-height: 32px; text-indent: 0; content: '▾'; font-family: "terra";}
	.fixedSkip:hover { text-decoration: none!important; background-color: #000; background-color: rgba(145,100,50,0.3);}

	/* スライダー 文字入れ */
	#indexIntro div.box{ position:absolute; z-index: 3; top:0;left: 0;right: 0;bottom: 0;margin: auto; /*background:linear-gradient(to top,rgba(0,0,0,0) 0,rgba(0,0,0,.6) 100%);*/}
	#indexIntro p{ position:absolute; z-index: 3; top:5%;left: 0;right: 0;bottom: 0;margin: auto; color:#fff; word-break: break-all; text-align:center; width:80%; line-height:1.6; font-size:22px;}
	#indexIntro p span.txt,#indexIntro p span.area{ padding:3px 5px;text-shadow: 3px 3px 3px #000;}
	#indexIntro p span.area{text-shadow: 3px 3px 3px #000; padding:1px 5px;}
	#indexIntro a{ position:absolute; z-index:9999; width:100%; height:100%; top:0;left:0; background:#fff; filter:alpha(opacity=0);-moz-opacity:0;opacity:0;}
	#indexIntro a:hover{ background:#fff; filter:alpha(opacity=40);-moz-opacity:0.4;opacity:0.4;}


@media(min-width:768px) {
	#indexIntro .fixedSkip { display: block;}
}
@media(max-width:991px) {
	#indexIntro .fixedSkip { display:none;}
	#indexIntro p{ position:absolute; z-index: 3; top:5%;left: 0;right: 0;bottom: 0;margin: auto; color:#fff; word-break: break-all; text-align:center; width:80%; line-height:1.6; font-size:16px;}
	#indexIntro p span.area{ display:block;}
	.mj .pic{margin:0 auto;}
}
@media(min-width:1600px) {
	#indexIntro p{ position:absolute; z-index: 3; top:15%;left: 0;right: 0;bottom: 0;margin: auto; color:#fff; word-break: break-all; text-align:center; width:80%; line-height:1.6; font-size:22px;}
}

	/********************************************
	 * MJとは
	 ********************************************/
	.mj{ position: relative; max-width: 100%; margin: 0 auto; padding: 0;}
	.mj .pic{ width:300px;margin:0 auto; margin:2em auto 2em auto;}
	.mj p{margin-top:30px; vertical-align: middle;}
	
@media(max-width:640px) {
	.mj .pic{ max-width:85%;margin:0 auto;vertical-align: middle;}
}

	/********************************************
	 * BLOG
	 ********************************************/
	.blogBg{ background-image: url(../img/bg/blog_bg.jpg); width:100%; background-repeat: no-repeat; background-position: 50% 50%; background-size: cover;}
	.blog{ position:relative; z-index:15;}
	.blog .box {margin-bottom:3em;}
	.blog .box h3{ color:#fff; font-size:16px;margin-top:5px; line-height:1.6;width:100%;}
	.blog .box p{ color:#fff; font-size:14px;}
	.blog .box a img{ width:100%;}
	.blog a.zoom { display: block; overflow: hidden; height:auto;}
	.blog figure { margin: 0; padding: 0; overflow: hidden; position: relative; text-align: center;}
	.blog figure img { -webkit-transform: scale(1); transform: scale(1); -webkit-transition: .3s ease-in-out; transition: .3s ease-in-out;}
	.blog a:hover>figure { opacity: 1;}
	.blog a:hover>figure img { -webkit-transform: scale(1.3); transform: scale(1.3);}
	/* 更新日 */
	.sideTag { position: relative; color: #fff; display: inline-block; overflow: hidden;}
	.sideTag p { display: inline;}
	.sideTag p span { position: absolute; display: inline-block; right: -30px; font-size:70%; text-align: center; text-transform: uppercase; top: 14px; background: #d93131; width: 100px; padding:0 6px;letter-spacing:normal;
		background:#DC4141;-webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg);
		/* box-shadow */
		box-shadow:rgba(189, 58, 58, 0.44) 0px 5px 3px -4px;	-webkit-box-shadow:rgba(59, 62, 66, 0.65) 0px 5px 3px -4px;	-moz-box-shadow:rgba(59, 62, 66, 0.65) 0px 5px 3px -4px;}

@media(min-width:992px){
	.blog .box h3{ color:#fff; font-size:16px;margin-top:5px; line-height:1.6;width:240px;}
}
@media(max-width:991px) {
	.blog .box h3{ color:#fff; font-size:16px;margin-top:5px; line-height:1.6;text-align:left;}
}
@media(max-width:640px){
	.blog .box{text-align:center;}
	.blog .box h3{ color:#fff; font-size:16px;margin-top:5px; line-height:1.6;width:100%;text-align:left;}
	.blog.grid[data-each].must3>* { float: left; width: 100%;}
}


	/********************************************
	 * 提携企業
	 ********************************************/
	.company .detail { margin-bottom: 1.5em;}
	.company .detail .picline { border:1px solid #E3E1E2;}