@charset "utf-8";
/* CSS Document */

/*------------------------------------------------------------
レスポンシブ用
------------------------------------------------------------*/

/*-----レスポンシブ------*/

/* ウィンドウ幅が2496px以上の場合に適用 */
@media screen and ( min-width:2496px )
{
/* 左メニュー関連の調整 */
#in_contents #top h1 img{
	width: 2496px;
	height: auto;
	margin: 0 auto;
}

#in_contents #present .car_img img{
	width: 2496px;
	height: auto;
	margin: 0 auto;
}

}

/* ウィンドウ幅が1920px以上の場合に適用 */
@media screen and ( min-width:1921px )
{

/*#in_contents .pc1 { display: none !important; }
#in_contents .pc2 { display: inline !important; }*/

}

/* ウィンドウ幅が0-1920pxの場合に適用 */
@media screen and ( max-width:1920px )
{

/*#in_contents .pc1 { display: inline !important; }
#in_contents .pc2 { display: none !important; }*/

#in_contents img{
	width: 92%;
	height: auto;
}

#in_contents .contents_box{
	width: 100%;
	height: auto;
	/*margin: 0 auto 4%;*/
}

#container .margin_t32{
	margin-top: 3.2%;
}

#container .margin_t7{
	margin-top: 7%;
}

#container .margin_b7{
	margin-bottom: 7%;
}

#container .margin_b10{
	margin-bottom: 10%;
}

#in_contents .icon_01{
	width: 5%;
	height: auto;
}

/*#in_contents .ya_01{
	top: -40px;
}

#in_contents .ya_01 img{
	width: 6%;
	height: auto;
}*/

#in_contents #present .car_img img{
    width: 100%;
    height: auto;
}

#in_contents #utulity .list01{
	width: 88%;
	height: auto;
}

#in_contents #utulity .list01 li{
	width: 40%;
	height: auto;
}

#in_contents #utulity .list01 .img{
	width: 55%;
	height: auto;
}

#in_contents #utulity .list01 .img img{
	width: 100%;
	height: auto;
	max-width: 1000px;
}

#in_contents #utulity .list01 .txt{
	margin-top: 2%;
}

#in_contents #utulity .list01 .txt img{
	width: 90%;
	height: auto;
	max-width: 1000px;
}

#in_contents #utulity .raku .list01 .txt{
	width: 45%;
	height: auto;
	padding-top: 3%;
}

#in_contents #utulity .raku .list01 .img{
	width: 54%;
	height: auto;
}

#in_contents #f_linkbtn .shop_img img{
	width: 100%;
	height: auto;
}

#in_contents #color ul{
    width: 97.2%;
    height: auto;
}

#in_contents h2 img{
    width: 100%;
    height: auto;
}


}

/* ウィンドウ幅が0-1500pxの場合に適用 */
@media screen and ( max-width:1500px ){

/*#in_contents .in_sonar li{
	font-size: 18px;
}

#in_contents .in_sonar h3{
	font-size: 1.2em;
	width: 95%;
	height: auto;
}

#in_contents .in_sonar h4{
	font-size: 1.2em;
	font-weight: bold;
	margin-bottom: 1em;
}

#in_contents .in_sonar .txt01{
	padding-right: 0.5em;
}*/

#in_contents .note2{
	width: 90%;
	height: auto;
}

#in_contents .note3{
	width: 90%;
	height: auto;
}


}

/* ウィンドウ幅が0-1200pxの場合に適用 */
@media screen and ( max-width:1200px )
{

#in_contents .link_menu a {
    font-size: 20px;
    line-height: 20px;
}

#in_contents #top_bar {
    width: 100%;
    height: 50px;
}

#in_contents .link_menu {
    top: 14px;
}

#in_contents .link_menu li:last-child{
	padding-left: 25px;
	padding-right: 15px;
}

#in_contents #top_bar .logo {
    position: absolute;
    top: 6px;
    left: 10px;
    width: 160px;
    height: auto;
}

/*#in_contents .day img{
	margin: 3.5% auto;
}

#in_contents .ya_01{
	top: -30px;
}

#in_contents .in_sonar li{
	float: none;
	width: 100%;
	height: auto;
	font-size: 18px;
}

#in_contents .in_sonar h3{
	width: 100%;
	height: auto;
}

#in_contents .in_sonar h4 br{
	display: none;
}

#in_contents .in_sonar .txt01{
	padding-bottom: 1em;
}

#in_contents .in_sonar li:last-child{
	text-align: center;
}

#in_contents .in_sonar li img{
	width: 100%;
	height: auto;
}*/

#in_contents .disp_img .txt{
	font-size: 1.2em;
	padding-top: 0.5em;
	line-height: 1.5em;
}

#in_contents .disp_img li{
	width: 38%;
	height: auto;
}

#in_contents .disp_img li:last-child{
	width: 57%;
	height: auto;
}

#in_contents .disp_img li img{
	width: 88%;
	height: auto;
}

#in_contents .note2{
	width: 86%;
	height: auto;
}

#in_contents .note3{
	width: 86%;
	height: auto;
}

#in_contents #utulity .list01 .txt img {
    width: 100%;
    height: auto;
}

#in_contents #utulity .wide_v .img{
   width: 48%;
    height: auto;
}

#in_contents #utulity .list01 .txt03{
    width: 50%;
    height: auto;
    margin-top: 0;
}

#in_contents #utulity .raku .list01 .txt{
	width: 53%;
	height: auto;
	padding-top: 3%;
}

#in_contents #utulity .raku .list01 .img{
	width: 46.5%;
	height: auto;
}

#in_contents #utulity .wide_v .list01 .txt{
	margin-top: 0;
}

}

/* ウィンドウ幅が0-767pxの場合に適用 */
@media screen and ( max-width:767px )
{

.pc { display: none !important; }
.sp { display: inline !important; }

#in_contents .link_menu a {
    font-size: 18px;
    line-height: 1.2;
    display:block;
}

#in_contents #top_bar {
    width: 100%;
    height: 75px;
}

#in_contents .link_menu li{
	border-left: 1px solid white;
	border-right: none;
}

#in_contents .link_menu li:last-child{
	padding-left: 25px;
	padding-right: 15px;
}

#in_contents #top_bar .logo {
    position: absolute;
    top: 16px;
    left: 10px;
    width: 310px;
    height: auto;
    max-width: 310px;
}

#in_contents #con_top{
	border-bottom: 8px solid #231815;
}

/*#in_contents .ya_01{
	top: -20px;
}

#in_contents .car_img{
	border-bottom: 8px solid #231815;
}*/

#in_contents .bk_00{
	border-top: 8px solid #231815;
}

#in_contents .bk_01{
	border-top: 8px solid #231815;
}

#in_contents h2{
	margin-top: 6%;
}

/*#in_contents #present .linkbtn{
	width: 80%;
	height: auto;
}*/

#in_contents .safety_list li{
	margin-bottom: 8%;
}

#in_contents #tconnectservice li img{
	max-width: 894px;
}

#in_contents .disp_img li{
	float: none;
	width: 90%;
	height: auto;
	text-align: right;
	margin-left: auto;
	margin-right: auto;
}

#in_contents .disp_img li img{
	width: 100%;
	height: auto;
}

#in_contents .disp_img li:last-child{
	width: 90%;
	height: auto;
}

#in_contents .disp_img .txt{
	width: 95%;
	height: auto;
	font-size: 1em;
	line-height: 1.5em;
}

#in_contents .note2{
	width: 95%;
	height: auto;
	margin-top: 1em;
}

#in_contents #tconnectservice .note2{
	display: none;
}

#in_contents .note3{
	width: 90%;
	height: auto;
	margin-top: 1em;
}

#in_contents #utulity .list01{
	margin-top: 0;
}

#in_contents #utulity .list01 li {
    float: none;
    width: 98%;
    height: auto;
	margin-bottom: 5%;
}

#in_contents #utulity .list01 .img {
    width: 100%;
    height: auto;
}

#in_contents #utulity .list01 .txt {
    margin-top: -3%;
}

#in_contents #utulity .list01 .txt03 {
    width: 98%;
    height: auto;
    margin-top: 0;
}

#in_contents #utulity .wide_v .list01 img {
    margin-top: 0;
    margin-bottom: 0;
}

#in_contents #utulity .wide_v .list01 .img img {
    margin-top: 7%;
}

#in_contents #utulity .raku .list01 .txt{
	width: 95%;
	height: auto;
	padding-top: 1%;
}

#in_contents #utulity .raku .list01 .img{
	width: 95%;
	height: auto;
	padding-top: 7%;
}

#in_contents #color ul {
    width: 94.4%;
    height: auto;
    margin: 0 auto 7%;
}

#in_contents #price .list01{
	width: 98%;
	height: auto;
}

#in_contents #price .list01 li{
	float: none;
	width: 100%;
	height: auto;
	margin-bottom: 5%;
}

#in_contents #price .img img{
	width: 93%;
	height: auto;
}

#in_contents #price .price_h{
	width: 96%;
	height: auto;
}

#in_contents #price .note{
	width: 89%;
	height: auto;
	margin: -2% auto 7%;
}

#in_contents #assist img{
	width: 89%;
	height: auto;
}

#in_contents #plan .img img{
	width: 89%;
	height: auto;
}

#in_contents #plan .note{
	width: 89%;
	height: auto;
}

#in_contents #plan .note h3{
	width: 50%;
	height: auto;
	margin-bottom: 2%;
}

/*改行調整*/
#in_contents .pc3 { display: none !important; }
#in_contents .sp3 { display: inline !important; }

}

/* ウィンドウ幅が0-540pxの場合に適用 */
@media screen and ( max-width:540px )
{

#in_contents .link_menu a {
    font-size: 17px;
}

#in_contents #top_bar {
    width: 100%;
    height: 70px;
}

#in_contents .link_menu {
    top: 12px;
}

#in_contents .link_menu li{
	border-left: 1px solid white;
	border-right: none;
}

#in_contents .link_menu li:last-child{
	padding-left: 20px;
	padding-right: 10px;
}

#in_contents #top_bar .logo {
    top: 20px;
    left: 10px;
    width: 240px;
    height: auto;
}

/*#in_contents .ya_01{
	top: -10px;
}

#in_contents .in_sonar li{
	font-size: 15px;
}

#in_contents .in_sonar h4 br{
	display: inline;
}

#in_contents .in_copyright{
	padding-top: 0.8em;
	font-size: 0.75em;
}*/

}

/* ウィンドウ幅が0-470pxの場合に適用 */
@media screen and ( max-width:470px )
{

#in_contents .link_menu a {
    font-size: 15px;
    line-height: 15px;
}

#in_contents .link_menu {
    top: 15px;
}

#in_contents .link_menu li{
	border-left: 1px solid white;
	border-right: none;
    padding: 0.2em 0.5em 0.1em 0.5em;
}

#in_contents .link_menu li:last-child{
	padding-left: 20px;
	padding-right: 10px;
}

#in_contents #top_bar {
    width: 100%;
    height: 60px;
}

#in_contents #top_bar .logo {
    top: 18px;
    left: 5px;
    width: 190px;
    height: auto;
}

/*改行調整*/
#in_contents .pc3 { display: inline !important; }
#in_contents .sp3 { display: none !important; }

}

/* ウィンドウ幅が0-384pxの場合に適用 */
@media screen and ( max-width:384px )
{

#in_contents .link_menu a {
    font-size: 13px;
    line-height: 13px;
}

#in_contents .link_menu {
    top: 8px;
}

#in_contents .link_menu li{
    padding: 0.2em 0.2em 0.1em 0.2em;
}

#in_contents .link_menu li:last-child{
	padding-left: 12px;
	padding-right: 2px;
}

#in_contents #top_bar {
    width: 100%;
    height: 47px;
}

#in_contents #top_bar .logo {
    top: 11px;
    left: 10px;
    width: 56%;
    height: auto;
}

#in_contents #con_top{
	border-bottom: 5px solid #231815;
}

/*#in_contents .day_ul li{
	width: 100%;
	height: auto;
	float: none;
	border-right: none;
	text-align: left;
	margin: 2% 0 4% 2.2%;
}

#in_contents .day_ul li:last-child{
	text-align: left;
}

#in_contents .ya_01{
	top: -15px;
}*/

#in_contents .bk_00{
	border-top: 5px solid #231815;
}

#in_contents .bk_01{
	border-top: 5px solid #231815;
}

#in_contents #safety .safety_list li{
	margin-top: 9%;
}

#in_contents .pc3 { display: none !important; }
#in_contents .sp3 { display: none !important; }

#in_contents #utulity .f_right{
	float: none;
}

#in_contents #utulity .f_left{
	float: none;
}

#in_contents #utulity .list01 li{
	width: 100%;
	height: auto;
}

#in_contents #utulity .list01 .img {
    width: 100%;
    height: auto;
}

#in_contents #utulity .list01 .txt img {
    width: 100%;
    height: auto;
}

#in_contents #utulity .tx02{
    margin-top: -2%!important;
    margin-bottom: 3%;
}

#in_contents #utulity .wide_v{
    margin-top: 7%!important;
}

#in_contents #utulity .wide_v .list01 .img img{
	margin-bottom: 1%;
}

#in_contents #utulity .wide_v .list01 .txt img{
	margin-top: 0;
}

#in_contents #utulity .raku{
	margin-top: 7%;
	margin-bottom: 7%;
}

/*#in_contents .in_copyright{
	font-size: 0.8em;
	margin: 5% auto 3%;
}*/

#in_contents .note{
	font-size: 0.7em;
}

#in_contents .note3{
	font-size: 0.7em;
}

}