@charset "utf-8";

/* mainvisual
============================================= */

.mainvisual {
	overflow: hidden;
	padding: 20px 0;
	background-color: #bfe5ff;
}

.mainvisual .left {
    display: inline-block;
    max-width: 700px;
    min-height: 100px;
}

.mainvisual .right {
	float: right;
}

.mainvisual .right li {
	margin-bottom: 20px;
}

.mainvisual .right .last {
	margin-bottom: 0;
}

/* contents-trouble
============================================= */

.contents-trouble {
	margin-bottom: 0;
	width:950px;
	height: 251px;
	overflow:hidden;
	background:url(../img/trouble_bg.png) no-repeat;
}

.contents-trouble ul li {
	float:left;
	width:115px;
	margin:85px 3px 61px 16px;
}

.contents-trouble ul li p {
	width: 115px;
	height: 105px;
	text-align: center;
	margin: 0 auto;
	font-size: 85%;
	font-weight: bold;
}

.lh17 {
	line-height: 17px;
}

.lh23 {
	line-height: 23px;
}

p.pt10 {
    padding-top: 10px;
}
p.pt15 {
    padding-top: 15px;
}
p.pt20 {
    padding-top: 20px;
}
p.pt25 {
    padding-top: 25px;
}

.trouble-text-red {
	color:#ff6600;
}

.trouble-text-big2 {
	font-size:160%;
}

.trouble-text-big3 {
	font-size:220%;
}

/* contents-posting
============================================= */

.contents-posting {
	width:950px;
	height:396px;
	background:url(../img/posting_bg.png) no-repeat;
}

.posting-charm {
	padding-top: 55px;
}

.contents-posting-inner01 {
	overflow:hidden;
	padding: 65px 50px 0 63px;
}

.contents-posting-inner02 {
	overflow:hidden;
	padding: 35px 30px 0;
}

.contents-posting-inner01 .left,
.contents-posting-inner02 .left {
	float: left;
	height:115px;
	text-align: center;
}

.contents-posting-inner01 .right,
.contents-posting-inner02 .right {
	float: right;
	height:115px;
	text-align: center;
}

.contents-posting-inner01 p,
.contents-posting-inner02 p {
	font-weight: bold;
}

.posting-text-big {
	color:#17b96b;
	font-size:200%;
}

.contents-posting .title {
	margin: 0 0 20px 0;
}

.posting-box {
	position: relative;
}

.posting-appeal {
	position: absolute;
	top: 15%;
	left: 39%;
}

.appeal-box {
	overflow: hidden;
	margin-bottom: 20px;
}

.appeal-box .left {
	float: left;
}

.appeal-box .right {
	float: right;
}

/* contents-menu
============================================= */

.contents-menu .title {
	margin: 0 0 20px 0;
}

.menu-row {
	overflow: hidden;
	margin-bottom: 20px;
}

.menu-col-left {
	float: left;
}

.menu-col-right {
	overflow: hidden;
	width: 627px;
	float: right;
}

.menu-col-right .left {
	float: left;
}

.menu-col-right .first {
	margin-bottom: 20px;
}

.menu-col-right .right {
	float: right;
}

/* contents-news
============================================= */

.news-box {
	overflow-y: auto;
	height: 140px;
}

.news-box dl.news {
	overflow: hidden;
	padding: 5px;
	border-bottom: 1px dotted #ff8300;
}

.news-box dt {
	float: left;
}

.news-box dd {
	padding-left: 110px;
}

/* contents-contact
============================================= */

.contents-bnr {
	overflow: hidden;
}

.contents-bnr .left {
	float: left;
}

.contents-bnr .right {
	float: right;
	width:334px;
	height:165px;
	text-align:center;
	border:5px solid #8bd7da;
}
.contents-bnr .right p {
	font-size:110%;
	color:#77c1cc;
}

.contents-bnr .right img {
	margin-bottom:7px;
}

.contents-contact {
	margin: 0;
}

/*2016.4.26
------------------------------------------------*/
strong{
	font-weight:bold;
}

.introduction-box{
	margin:0 0 60px 0;
}

.introduction-box .title {
	margin: 0 0 20px 0;
}



.mainvisual ul.right.right-sp {
    display: none;
}
.contents-box.introduction-box-sp {
    display: none;
}
.contents-box.contents-trouble-sp {
	display: none;
}
.contents-box.contents-posting-sp {
	display: none;
}
.contents-box.contents-menu .menu-row-sp {
	display: none;
}
.contents-box h2.title-sp {
	display: none;
}



.float-box {
    overflow: hidden;
}
.contents-box.contents-news {
    float: left;
    width: 700px;
}
.contents-box.contents-news h2.title img {
    width: 100%;
    height: auto;
}
.movie-bnr {
    float: right;
    padding-top: 18px;
}



@media screen and (max-width: 980px) {

	
/*-------- メインビジュアル -----------*/
	.mainvisual .left {
		display: block;
		text-align: center;
		margin: 0 auto 20px;
	}
	
	.mainvisual .right {
		float: none;
		overflow: hidden;
	}
	
	.mainvisual .right li {
		margin-bottom: 0px;
		float: left;
		width: 33%;
		text-align: center;
	}
	
/*-------- 新着情報 -----------*/
.contents-box.contents-news {
    float: none;
    width: 100%;
}

.movie-bnr {
    float: none;
    text-align: center;
    padding-top: 0px;
    margin-bottom: 25px;
}
	
/*-------- こんなことでお困り -----------*/
	
	.contents-box.contents-trouble {
		display: none;
	}
	
	.contents-box.contents-trouble-sp {
		display: block;
	}
	
	.contents-box.contents-trouble-sp ul {
		overflow: hidden;
		border: 1px solid #09f;
		padding: 0 3% 20px;
	}
	
	.contents-box.contents-trouble-sp ul li {
		height: 50px;
		width: 47%;
		text-align: center;
		border: 3px solid #94d4ff;
		margin: 20px 0px 0px;
		font-weight: bold;
        display: flex;
        align-items: center;
	}
    
    .contents-box.contents-trouble-sp ul li p {
		width: 100%;
	}
	
	.contents-box.contents-trouble-sp ul li:nth-child(odd){
		float: left;
	}
	.contents-box.contents-trouble-sp ul li:nth-child(even){
		float: right;
	}
	
/*-------- ポスティングの魅力 -----------*/
	
	.contents-box.contents-posting {
		display: none;
	}
	
	.contents-box.contents-posting-sp {
		display: block;
	}
	
	.contents-box.contents-posting-sp ul {
		overflow: hidden;
		padding: 0 0% 20px;
	}
	
	.contents-box.contents-posting-sp ul li {
		height: 50px;
		width: 49%;
		text-align: center;
		margin: 20px 0px 0px;
		background: #ebebeb;
		color: #17b96b;
		font-size: 120%;
		font-weight: bold;
		line-height: 2.5;
        display: flex;
        align-items: center;
	}
	
    .contents-box.contents-posting-sp ul li p {
        width: 100%;
    }
    
	.contents-box.contents-posting-sp ul li:nth-child(odd){
		float: left;
	}
	.contents-box.contents-posting-sp ul li:nth-child(even){
		float: right;
	}
	
	
/*-------- 詳しくはこちら -----------*/
	
	.contents-box.contents-menu .menu-row {
		display: none;
	}
	
	.contents-box.contents-menu .menu-row-sp {
		display: block;
	}
	
	.contents-box.contents-menu .menu-row-sp ul {
		overflow: hidden;
	    max-width: 710px;
    	margin: auto;
	}
	
	.contents-box.contents-menu .menu-row-sp ul li {
		float: left;
		margin: 0 10px 20px 0;
		max-width: 230px;
	}
	
	.contents-box.contents-menu .menu-row-sp ul li.nmr {
		margin-right: 0px;
	}
	
/*-------- ご紹介 -----------*/
	
	.contents-box.introduction-box {
		display: none;
	}
	
	.contents-box.introduction-box-sp {
		display: block;
	}
    
    .contents-box.introduction-box-sp h2.title-sp,
    .contents-box.introduction-box-sp h2.title{
        margin-bottom: 10px;
    }
	
	.contents-bnr .left {
    	float: none;
		margin: 0px auto 20px;
	}
	.contents-contact {
		max-width: 586px;
		width: 100%;
	}
	
	.contents-bnr .right {
    	float: none;
		margin: auto;
		max-width: 334px;
    	width: auto;
	}

	
}



@media screen and (max-width: 750px) {

/*-------- ヘッダー -----------*/
/*-------- メインビジュアル -----------*/
	
	.mainvisual ul.right {
		display: none;
	}
	.mainvisual ul.right.right-sp {
		display: block;
	}
	
/*-------- 新着情報 -----------*/
/*-------- こんなことでお困り -----------*/
/*-------- ポスティングの魅力 -----------*/
/*-------- 詳しくはこちら -----------*/
	
	.contents-box.contents-menu .menu-row-sp ul li.nmr {
		margin-right: 10px;
	}
	
	.contents-box.contents-menu .menu-row-sp ul li:nth-child(even){
		margin-right: 0px!important;
	}
	
	.contents-box.contents-menu .menu-row-sp ul {
		max-width: 470px;
		width: 100%;
	}
	
	.contents-box.contents-menu .menu-row-sp ul li {
		width: 48%;
	}
	
	
/*-------- ご紹介 -----------*/
/*-------- フッター -----------*/


}


@media screen and (max-width: 700px) {
    
    .bx-controls-direction {
        display: none;
    }

/*-------- こんなことでお困り -----------*/
	.contents-box.contents-trouble-sp ul li {
		width: auto;
	}
	.contents-box.contents-trouble-sp ul li:nth-child(odd) {
		float: none;
	}
	.contents-box.contents-trouble-sp ul li:nth-child(even) {
		float: none;
	}
	
/*-------- ポスティングの魅力 -----------*/	
	.contents-box.contents-posting-sp ul li {
		width: auto;
	}
	.contents-box.contents-posting-sp ul li:nth-child(odd) {
		float: none;
	}
	.contents-box.contents-posting-sp ul li:nth-child(even) {
		float: none;
	}
	
}


@media screen and (max-width: 560px) {
	
	.contents-box h2.title,
	.contents-box .midashi-tit {
		display: none;
	}
	.contents-box h2.title-sp {
		display: block;
	}
	
	
/*-------- 新着情報 -----------*/
	.news-box {
		overflow-y: auto;
		height: 250px;
	}
	.news-box dt {
		float: none;
	}
	.news-box dd {
		padding-left: 20px;
	}
	
/*-------- ポスティングの魅力 -----------*/	
	.contents-box.contents-posting-sp ul li {
    	font-size: 110%;
	}

/*-------- 詳しくはこちら -----------*/
	.contents-box.contents-menu .menu-row-sp ul li {
		margin: 20px 10px 0px 0;
	}
	
	.contact-btn {
		width: 45%;
	}
}

@media screen and (max-width: 430px) {
/*-------- 詳しくはこちら -----------*/
	.contact-btn {
		bottom: 20px;
	}
}
