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

@media screen and (max-width: 1150px) {
	#home #header .content { background:rgba(0,0,0,0.9);}
	#home section { width:100%;}
	#home #slide_area p { width:100%;}
	#home #slide_area p.note  { top:120px;}
	#home #slide_area p.note img { width:30%; }


	#home h2 { margin: 0 25px; background-size:200px; font-size:18px; height:200px; line-height:30px; width:200px; letter-spacing: 2px; box-sizing: border-box;}
	#home h2 b { font-size:24px; }
	#home h2 span { font-size:11px; margin-top:8px; letter-spacing: 0;}
	#home #plan_area { width:100%;}
	#home #plan_area h2 { background-size:200px; }
	#home #plan_area .p_bnr { width:73%; width:calc(100% - 250px) ;width:-webkit-calc(100% - 250px) ; }
	#home #plan_area #recommend_489ban { width:100%;}
	.PlanView { padding:10px; margin: 0 1% 4% 1%; width:31%; box-sizing: border-box;}
	.picture { margin:0 ; width:100%; box-sizing: border-box; }
	.picture img { width:100%; }
	.explan { width:100%; }
	#home #point_area .item{ width:90%;}

  #home #point4 dd p,#home #point5 dd p { width: 65%; padding: 0 0 0 2%;}
  #home #point4 dd span,#home #point5 dd span { width: 25%;}
  #home #point4 .key_v, #home #point5 .key_v { float: right; width: 86%; margin: 2% 0 0 2%;}

	#home #point_area h2 { /*margin:0 0 180px ;*/ left:50px; top:100px; z-index: 100;}
	#home #point1 .key_v { width: 60%;}
	#home #point1 .sub_v { width:300px; top:-150px; }
	#home #point1 dl { margin:auto 2%; width:36%;}
	#home #point1 dd { margin-top: 70px;}
	#home #point1 dd span { margin-left:30%;}
	#home #point2 .key_v { width: 60%;}
	#home #point2 dl {margin:auto 2%; width:36%;}
	#home #point3 dl {margin:auto 2%; width:36%;}
	#home #point3 .key_v { width: 45%;}
	#home #point3 .sub_v { width:300px;}

	#home #feed { border-top:3px solid #000; border-bottom:3px solid #333; color:#000; float:right; margin-right:3%; width:60%; width:calc(97% - 300px); width:-webkit-calc(97% - 300px); }
	#home #news_area #feed + p { margin-left:50px;}

	#home #guide_area { margin:auto; width:96%;}
	#home #guide_area li { margin-right:1%; width:24%; }

/*170907_tsukamoto*/
	#home #guide_area ul:nth-child(2) li { width: 24%;}
	}

@media screen and (max-width:940px){
	#home #slide_area p.bnr {top:-94px;}
	#home #slide_area p.bnr a img,
	#home #slide_area p.bnr img { margin-right:1%; width:130px;}
	#home #slide_area p.bnr img.bnr_long{width: 173px;}
	}

@media screen and (max-width: 900px) {
  #home #point4 dd p,#home #point5 dd p { float: none; width: 100%; padding: 0;}
  #home #point4 dd span,#home #point5 dd span { float: none; width: 25%; margin: 0 auto;}
  #home #point4 .key_v, #home #point5 .key_v { float: none; width: 100%; margin: 2% 0 0 0;}
	}


@media screen and (max-width: 860px) {
    #home #contents .bnr { margin: 25px 2%;}
}

@media screen and (max-width: 768px) {
	#home #slide_area p.note { top:80px;}
	#home #slide_area p.note img { width:40%; }
	#home #slide_area p.bnr { top:-92px; margin-bottom:-150px; text-align: right;}

	#home #plan_area .p_bnr { float:none; margin: 10px 2%; padding:0; width:96%; }
	#home #plan_area h2,
	#home #news_area h2{ float:none; margin: auto; }
	#home #point_area h2{ left:50%; top:0; margin:50px -100px 0 auto ; }
	#home #point_area dl { float:none;margin:auto 0; width:100%;}
	#home #point_area dt { border-right:none; border-left:none; border-top:1px solid #444; border-bottom:1px solid #444; float:none; padding:10px 0 ;line-height: 1.7;  text-align: center; width:100%; box-sizing: border-box; }
	#home #point_area dd { padding:10px 15px;}
	#home #point_area dd span { float:left; margin-right:15px;}
	#home #point1 .key_v { margin: 0 auto; float:none; width:100%;}
	#home #point1 .sub_v { display: none; }
	#home #point1 dd { margin-top:0;}
	#home #point1 dd p { padding-top:30px;}
	#home #point1 dd span { margin-left:0;}

	#home #point2::before { left: 0;}
	#home #point2 .key_v { float:none; width:100%;}
	#home #point2 dt{ border-color:#956e65; margin-left:0;}
  #home #point2 dt img { display: none;}

	#home #point3::before { left: 0;}
	#home #point3 .key_v { float:none; margin:0; width:100%;}
	#home #point3 .sub_v { display: none;}
	#home #point3 dt { border-color:#967c65; }

	#home #point4 { width:100%; float:none; }
	#home #point5 { width:100%; margin:30px 0; float:none; }
	#home #point4 dt,
	#home #point5 dt { float:none;}
	#home #point4 .key_v,
	#home #point5 .key_v { margin:0; width:100%;}
	#home #point_area dt span{/*縦書きを横書きにする*/
	-ms-writing-mode: horizontal-tb;            /* IE用　*/
	-webkit-writing-mode: horizontal-tb;  /* chrome用　*/
	-o-writing-mode: horizontal-tb;       /* opera用　*/
	writing-mode: horizontal-tb;
	margin-right:10px;}

	#home #feed {float:none; margin:5%; width:90%;}
	#home #news_area #feed + p { float:none; margin: 0 10%; width:80%; }
	#home #feed li span { float:none;}

 /* notice */
 #home #plan_area { padding: 1% 0 0;}
 #home #notice { width: 90%; margin: 0 auto 3%; padding: 4%;}
 #home #notice dd { width: 100%;}

	}

@media screen and (max-width: 640px) {
	body#home { padding-top:60px !important;}
	#home #slide_area p.note img { width:50%; }
	#home #slide_area p.bnr { display: none; }
	#home #sp_bnr{ display: block;width: 90%;margin: auto;}
	#home #sp_bnr a { display: block;display: block;margin: 0 auto 10px;max-width: 300px;}
	#home #plan_area .p_bnr { display: none; }
	#home #plan_area .p_inf { display: block; margin:0 5%; width:90%; }
	#home #plan_area .p_inf li { font-size:22px; display: block; line-height: 1; padding:20px 0; position: relative;}
	#home #plan_area .p_inf li span:not([class]){ font-size:15px; margin-right:10px;}
	#home #plan_area .p_inf li b { color:#d4763b; }
	#home #plan_area .p_inf li b em{ font-size:38px; font-style:normal; text-shadow: 1px 1px 1px #FFF; }
	#home #plan_area .p_inf li small { font-size:12px;/* display: block;*/}
	#home #plan_area .p_inf li:nth-of-type(1) { padding:20px 0 40px 100px; border-bottom:1px solid #555;}
	#home #plan_area .p_inf li:nth-of-type(1)::before{content:""; display: block; height:63px; width:88px; background:url(../../img/ic_bestrate.png); background-size:100% auto; position: absolute; left:0; top:5px; margin-right:30px;}
	#home #plan_area .p_inf li:nth-of-type(2) span:not([class]) { display: block;}

	.PlanView { padding:10px; margin: 10px 5%; width:90%;}
	.picture { float:left; margin-right:10px ; width:50%; }
	.planlist li a{ float:right; }
	#home #guide_area li { margin-right:1%; margin-bottom:3px; width:48%; }
	#home #guide_area li:nth-of-type(2n+1) { clear:both; }

/*170905_tsukamoto*/
	#home #guide_area ul:nth-child(2) li { margin-bottom: 3px; width: 48%;}

  /* notice */
  #home #notice { width: 80%;}

	}

@media screen and (max-width: 480px) {
	#home #slide_area p.note { top:40px;}
	#plan_wrap { background-repeat: repeat;}
	#home #plan_area .p_inf { margin:0 15%; width:70%; }
	#home #plan_area .p_inf li:nth-of-type(1) span { display: block; margin-bottom:6px; }
	#home #plan_area .p_inf li:nth-of-type(2) span.wbr { display:block; margin:6px 0;}
	#home #plan_area .p_inf li:nth-of-type(2) small{ display: inline;}
	#home #point_area dd span { float:none; margin:0 auto;}
	#home #point_area dd p {margin-top: 10px;}

  /* notice */
  #home #notice dt span { display: block;}

	}

@media screen and (max-width: 380px) {
	#home #plan_area .p_inf { margin:0 10%; width:80%; }
	.picture { float:none; margin-right:0 ;width:100%; }
	#home #guide_area li { float:none; margin:6px 10%; margin-bottom:3px; width:80%; }

/*170907_tsukamoto*/
	#home #guide_area ul { margin: 0 auto;}
	#home #guide_area ul:nth-child(2) li  { float: none; margin: 6px 10%; margin-bottom: 3px; width: 80%;}
	#home #guide_area ul:nth-child(2) li img {padding-top: 0;}
	}



/* ---------------------------------------------------
	更新履歴
------------------------------------------------------

180326_mori_バナー追加作業、(max-width: 860px)追加
200127_mori CSS移動 #home #slide_area p.bnr img (max-width: 768px)
200127_mori #home #contents .bnr 追加
200203_mori #home #contents .bnr 更新（640px）
201027_haiguchi #home #slide_area p.bnr　4つ目バナー追加による調整、#home #sp_bnr 追加

------------------------------------------------------ */