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

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

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

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

#in_contents #top .top_menu{
	margin: 5px auto 16px;
}

}

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

/* 本番左メニュー対応 */
#in_contents #top .top_nav img {
	margin-right: 0;
}

#in_contents #top {
    position: fixed;
    top: 0;
    right: 0;
    z-index: 99;
    width: calc(100% - 240px)!important;
}

#in_contents #con_top img {
    margin-top: 69px !important;
}

}

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

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

}

/* ウィンドウ幅が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 20px;
}

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

}

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

/*上メニュー*/

#in_contents .pc_nav { display: none !important; }
#in_contents .sp_nav { display: inline !important; }

#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 15px;
}

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

#in_contents #lifestyle h2{
	font-size: 1.6em;
	margin: 0.9em auto 0.6em;
}

#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 15px;
}

}

/* ウィンドウ幅が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 10px;
}

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

#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: 36%;
	height: auto;
	margin: 1% 1% 0 1%;
}

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

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

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

#in_contents #top{
	width: 100%;
	height: 45px;
	padding-bottom: 10px;
}

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

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

#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;
}

}