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

/*------------------------------------------------------------
レスポンシブ用
------------------------------------------------------------*/

/*-----レスポンシブ------*/

/* ウィンドウ幅が2500px以上の場合に適用 */
@media screen and ( min-width:2500px )
{

#in_contents #top .top_menu{
	margin: 5px auto 16px;
}
  #in_contents .catalog img.btn {
  bottom: 230px;
}
}

/* ウィンドウ幅が1900px以上の場合に適用 */
@media screen and ( min-width:1900px )
{
    #in_contents .catalog img.btn {
  bottom: 180px;
}
}
/* ウィンドウ幅が1401px以上の場合に適用 */
@media screen and ( min-width:1401px )
{

.pc1 { display: none !important; }
.pc2 { display: inline !important; }
  
  #in_contents .catalog img.btn {
  bottom: 100px;
}
}



/* ウィンドウ幅が1400pxの場合に適用 */
@media screen and ( max-width:1400px )
{

.pc1 { display: inline !important; }
.pc2 { display: none !important; }

#in_contents img{
	width: 98%;
	height: auto;
}

#in_contents .contents_box{
	width: 100%;
	height: auto;
	margin: 0 auto 4%;
}

#container .margin_t32{
	margin-top: 3.2%;
}

#in_contents .margin_t45{
	margin-top: 4.5%;
}

#container .margin_t7{
	margin-top: 7%;
}

#container .margin_b7{
	margin-bottom: 7%;
}

#container .margin_b10{
	margin-bottom: 10%;
}

/*上メニュー*/

#in_contents #top .top_menu{
	margin: 1.7% auto;
}

#in_contents #top .logo{
	width: 22%;
	height: auto;
}

#in_contents #top .logo img{
	width: 100%;
	height: auto;
}

/*上メニューここまで*/

#in_contents #topBtn{
	width: 20%;
	height: auto;
	max-width: 183px;
}

#in_contents #choose img{
	width: 100%;
	height: auto;
}

#in_contents .tab li:first-child{
	padding-left: 1%;
}

#in_contents .tab li{
	width: 31%;
	height: auto;
}

#in_contents .slider01{
	width: 100%;
	height: auto;
}

#in_contents .slider01 img{
	width: 100%;
	height: auto;
}

#in_contents .pre_btn{
	width: 5%!important;
	height: auto;
	left: 1%;
	top: 42%;
}

#in_contents .next_btn{
	width: 5%!important;
	height: auto;
	right: 1%;
	top: 42%;
}

#in_contents #safety .tss_img{
	width: 100%;
	height: auto;
}

}

/* ウィンドウ幅が0-1100pxの場合に適用 */
@media screen and ( max-width:1100px )
{

/*上メニュー*/

#in_contents #top .logo{
	width: 23%;
	height: auto;
}

#in_contents #top{
	width: 100%;
	height: 50px;
}

#in_contents #top .top_nav{
	width: 67%;
	height: auto;
}

#in_contents #top .top_nav li{
	margin: 0.5% 0 0;
}

#in_contents #top .top_nav li:first-child{
	margin: 0% 0.5% 0 2%;
}

#in_contents #top .top_menu{
	margin: 1.4% auto;
}
	
#in_contents .top_nav a img{
	width: 70%;
	height: auto;
}

#in_contents #con_top img{
	margin: 50px auto 0;
}

/*上メニューここまで*/

}

/* ウィンドウ幅が0-700pxの場合に適用 */
@media screen and ( max-width:700px )
{

/*上メニュー*/

#in_contents .pc_nav { display: none !important; }
#in_contents .sp_nav { display: inline !important; }
  
#in_contents  h2 img{
  width: 100%;
}
#in_contents #top .logo{
	width: 38%;
	height: auto;
	margin: 2% 0 0 2%;
}

#in_contents #top .top_nav{
	margin: 1% auto 0;
	width: 57%;
	height: auto;
	text-align: right;
}

#in_contents #top .top_nav li{
	margin: 0;
	border-left: 1px solid white;
}

#in_contents #top .top_nav li:first-child {
    margin: 0% 0 0 1%;
}

#in_contents #top .top_nav li{
	width: 32%;
	height: auto;
}

#in_contents #top{
	width: 100%;
	height: 74px;
}

#in_contents #con_top img{
	margin: 74px auto 0;
}

/*上メニューここまで*/

  /* 日程・カタログ　*/
#in_contents #day img.ymd{
	width: 90%;
	height: auto;
  margin-top: 5%;
} 
  #in_contents #day  .catalog_sp {
    width: 90%;
    margin-top: 5%;
  }
  /*-----共通訴求ポイント------*/
#in_contents .point img {
  width: 90%;
  max-width: inherit;
}
  /* スマイルバリュープラン　*/
  #in_contents #keikaku  h2 img.sp {
    width: 90%;
  }

/* RAIZE 見出し*/
  #in_contents #raize h2 {
    margin-bottom: 5%;
  }  
  
  
#in_contents #lifestyle p{
	font-size: 1em;
	margin-bottom: 1.4em;
}

#in_contents .slider01{
	margin-bottom: 2.5%;
}

#in_contents #safety .ics_tx{
	margin-left: 4%;
}

#in_contents #f_linkbtn img{
	width: 70%;
	height: auto;
	margin-bottom: 1.5%;
}

#in_contents .bar_03{
	width: 100%;
	height: 50px;
}

#in_contents .in_copyright{
	font-size: 0.9em;
	line-height: 3.5em;
}

}

/* ウィンドウ幅が0-580pxの場合に適用 */
@media screen and ( max-width:580px ){

#in_contents #top{
	width: 100%;
	height: 65px;
}

#in_contents #con_top img{
	margin: 65px auto 0;
}

}

/* ウィンドウ幅が0-500pxの場合に適用 */
@media screen and ( max-width:500px ){

.pc { display: none !important; }
.sp { display: inline !important; }
.pc1 { display: none !important; }

/*上メニュー*/

#in_contents #top .logo{
	width: 42%;
	height: auto;
	margin: 1% 1% 0 1%;
}

#in_contents #top .top_nav{
	margin: 1.5% auto 0;
	width: 50%;
	height: auto;
	text-align: right;
}

#in_contents #top .top_nav li{
	width: 30%;
	height: auto;
}

#in_contents .top_nav a img{
	width: 80%;
	height: auto;
}

#in_contents #top{
	width: 100%;
	height: 50px;
}

#in_contents #con_top img{
	margin: 50px auto 0;
}

/*上メニューここまで*/

#in_contents #lifestyle{
	width: 90%;
	height: auto;
	margin-left: auto;
	margin-right: auto;
}

#in_contents #lifestyle h2{
	font-size: 1.1em;
	margin-left: 0;
	margin-right: 0;
}

#in_contents #lifestyle p{
	font-size: 0.8em;
	margin-left: 0;
	margin-right: 0;
}

#in_contents #safety .contents_box{
	text-align: left;
}

#in_contents #safety h4 {
	width: 98%;
	height: auto;
	margin-left: 2%;
	font-size: 1.2em;
}

#in_contents #safety h3{
	padding-top: 5%;
	padding-bottom: 3%;
	width: 90%;
	height: auto;
}

#in_contents #safety .sapo_img{
	text-align: center;
	margin: 6% auto;
}

#in_contents #safety .sapo{
	width: 90%;
	height: auto;
}

#in_contents #safety p {
	width: 98%;
	height: auto;
	margin-left: 2%;
	font-size: 0.9em;
}

#in_contents #safety .note{
	font-size: 0.6em;
}

#in_contents .bar_03{
	width: 100%;
	height: 40px;
}

#in_contents .in_copyright{
	font-size: 0.7em;
	line-height: 3.5em;
}

/*スライド文字*/
#in_contents .ex_slider{
	font-size: 0.6em;
	text-align: left;
}

#in_contents .ex_slider .note p{
	padding: 2.5% 1% 0 2%;
}

/*スライド*/
#in_contents .slider01 {
    margin-bottom: 0;
}

#in_contents .pre_btn{
	width: 5%!important;
	height: auto;
	left: 0;
	top: 33%;
}

#in_contents .next_btn{
	width: 5%!important;
	height: auto;
	right: 0;
	top: 33%;
}

#in_contents #interior .pre_btn{
	top: 24%;
}

#in_contents #interior .next_btn{
	top: 24%;
}

#in_contents #exterior .tab{
	border-bottom: 1px solid #221714;
	width: 95%;
	height: auto;
}

#in_contents #interior .tab{
	border-bottom: 1px solid #221714;
	width: 95%;
	height: auto;
}

#in_contents #f_linkbtn .note{
	font-size: 0.7em;
}

}

/* ウィンドウ幅が0-400pxの場合に適用 */
@media screen and ( max-width:400px ){

/*上メニュー*/

#in_contents #top .logo{
	width: 40%;
	height: auto;
	margin: 1% 1% 0 1%;
}

#in_contents #top .top_nav{
	margin: 2% auto 0;
	width: 55%;
	height: auto;
	text-align: right;
}

#in_contents #top .top_nav li{
	width: 30%;
	height: auto;
}

#in_contents #top{
	width: 100%;
	height: 45px;
}

#in_contents #con_top img{
	margin: 45px auto 0;
}

/*上メニューここまで*/

#in_contents #lifestyle{
	width: 96%;
	height: auto;
}

#in_contents #lifestyle h2{
	font-size: 1em;
	margin-left: 0.3em;
	margin-right: 0.3em;
	text-align: left;
}

#in_contents #lifestyle p{
	font-size: 0.8em;
	margin-left: 0.5em;
	margin-right: 0.5em;
	text-align: left;
}

}

