@charset "utf-8";

@media only screen and (max-width:768px){

    body{ min-width: 320px; overflow-x: hidden;}
    #footer,#footer_inner,#copyright,#copyright_inner {width: 100%;min-width:300px;}
    #footer_content {margin: 0 10px 40px 0;}

    .pc_dsp{
        display: none;
    }
   .head_nav_area,#gnavi,#lefttab,#righttab,#page-top,#footerContainer{
        display: none;
    }

    #topicpath {
    	margin: 10px;
    	width: 90%;
    }
    #topicpath li {
        font-size: 12px;
    }
    #contents_w h2{
        background: #046EB7;
        color:#FFF;
    }
    .cach_copy { font-size: calc(1vw + 9px); line-height: 1.4; letter-spacing: 0; }
    .cach_copy span{
        font-size: 100%;
        font-weight: 600;
    }
    .num2 .cach_copy{ font-size: calc(1vw + 9px); letter-spacing: 0; }
    /* ------------------------
    	bankin_sp
    ------------------------ */
    #overhead{ width: 100vw; min-width: 0; }
    #overhead img, #overhead_ly img{ width: 98%; }
    #overhead_ly{
        height: auto;
        border-top: 10px solid rgb(254, 242, 62);
        border-bottom: 10px solid rgb(254, 242, 62);
    }
    #overhead_ly img{ height: 49.0vw; }
    #overhead .link{
        position: absolute;
        width: 48%;
        height: 33%;
        display: block;
        left: 0;
        bottom: 0;
    }
    #overhead .link2{
        position: absolute;
        width: 48%;
        height: 33%;
        display: block;
        right: 0;
        bottom: 0;
    }

    .over_inner{ min-width: 300px }
    #header{
    	width: 100%;
        min-width: 300px;
        height: auto;
        padding-bottom: 10px;
        background: none;
    }
    #header .wrapper{
        width: 94%;
        margin: 0 auto;
    }
    #logo img{
        width: 120%;
        margin: 18px 0 -5px;
        min-width: 200px;
    }
    #header_l{
        width: 35%
    }
    #header h1 {
        font-size: calc(1.3vw + 2px);
        line-height: 10px;
        position: absolute;
        width: 95%;
        text-align: center;
        margin: 5px auto;
        overflow: hidden;
        white-space: nowrap;
    }
    #header_r{
        width: 100%;
        margin-top: 10px;
    }
    #header .txt p { display: none; }
    #topicach .txt p {
        font-size: calc(2vw + 2px);
        font-weight: bold;
        margin: 0;
        padding: 1em 0 0;
        text-align: center;
        z-index: 20;
    }

    #header_r p.midashi{
        margin-top: 1%;
        width: 100%;
        text-align: center;
        font-size: 90%;
        padding: 1px 0 2px;
        background:#0075ba;
        border-radius: 3px;
    }
    .redbox{
        padding: 0px 5px 0 6px;
        border-radius: 3px;
/*        color: #DB001E;
    filter:dropshadow(color=#ffffff,offX= 0,offY=-1)
    dropshadow(color=#ffffff,offX= 1,offY= 0)
    dropshadow(color=#ffffff,offX= 0,offY= 1)
    dropshadow(color=#ffffff,offX=-1,offY= 0);

    -webkit-text-stroke-color: #fff;
    -webkit-text-stroke-width: 1px;

    text-shadow: #fff 1px 1px 0px, #fff -1px 1px 0px,
                 #fff 1px -1px 0px, #fff -1px -1px 0px;*/
    }
    .telphone{
        width: 48.5%;
        height: auto;
    }

    .open{
        color: #fff;
        font-weight: 400;
        line-height: 100%;
    }
/*-----ＴＯＰアイキャッチ------*/
    #topicach{ width: 100%; }
    #topicach .layer_bg {
        margin-top: 5px;
    }
    #topicach .img1{ width:100%; margin-bottom: 25px; }
    #topicach .img1 img{
        margin-top: -0.5%;
    }

    #topicach .img2{
        width:93%;
      margin-top: 4%;
    }
    #topicach .img3{
        width:100%;
        margin: -1% auto 10px;
    }
    #topicach .img4{
        width:50%;
    }

    #topicach p {
        text-align: left;
        padding: 0 5% 10px;
        font-weight: bold;
        line-height: 1.5;
        color: #555;
    }

/*--------コンテンツ------------*/
    #wrapper{ margin-bottom: 0; }
    #contents_w{
    	width: 94%;
        margin: 0 auto;
    }
    #wrapper_l{
    	width: auto;
    }

    #contents_w .ttl_bg{
    	width: 100%;
    }
    div.hosyou {
        background-size: contain;
    }
    div.hosyou p{
        font-size: 223%;
        margin-top: 1.3%;
        letter-spacing: 0;
        text-align: center;
        padding-top: 1.5%;
        padding-bottom: 1.5%;
    }
    div.hosyou img{
        position: absolute;
    }
    .kome{
        margin: 0.5% auto;
        width: 90%;
        text-align: center;
        font-size: 90%;
        color: #888;
        line-height: 125%;
    }

    .ct_1 .txt_area{ background-size: 20% auto; }

    #contents_w .ct_2 .title{ margin: 20px auto; }
    .ct_2 .item{ width: 44%; margin: 0 auto; padding: 0 3%; }
    .ct_2 .item .number{ font-size: calc(2vw + 7px); line-height: 1; padding: 2vw; }

    .ct_2 .item .image:after{ margin: 18vw 0 0 1.1%; }
    .ct_2 .item:nth-child(2n) .image:after{ content:""; }

    .ct_2 .item:nth-child(1){ margin: 0 auto; }
    .ct_2 .item .txt{ font-size: 120%; width: 100%; margin-bottom: 30px; height: 5em; line-height: 1.2; }
    .ct_2 .item:after{
        content: "▼";
        font-size: 2em;
        color: rgb(10, 161, 71);
        text-align: center;
        display: block;
        padding-bottom: 15px;
        transform: scale( 4, 1 );
        width: 213%;
    }
    .ct_2 .item:nth-last-child(1):after{ content:""; }
    .ct_2 .item:nth-child(2n):after{ color: #fff; }

    .ct_3 .box{ padding: 15px 10px; }
    .ct_3 .item .name{ font-size: 90%; }
    .ct_3 a.line_bt{ max-width: 320px; margin: 0 auto; height: auto; }

    .cach_area {
        width: 92%;
        margin: 0 auto;
        padding: 10px;
        background-color: rgb(230, 241, 247);
        border-radius: 5px;
    }
    .cach_copy{ width: 100%!important; }
    .cach_copy span{ font-size: 130%; }

    .cach_area.num1,.cach_area.num2{ background-image: none; }

/*    #carousel{
        margin-left: 2%;
    }*/
    img.box_2_5 {
        width: 100%;
    }
    img.plus {
    width: 13%;
    margin: 2% 47%;
    }
/*-------カルーセル-------*/

    .cars_carousel .bxslider article {
        width: 47%;
    }
    .bx-prev,.bx-next{
        margin-top:-772px;
    }
    .bx-prev img,.bx-next img{
        width:15px;
    }
    .bx-prev{
        margin-left: -47%;
    }
    .bx-next{
        right: 3%;
    }


/*------BPセンターの特徴--------*/

    #contents_w .bankin .block h3,
    #contents_w .bankin .block h3.line2{
        font-size: 190%;
        position: relative;
        width: 150%;
    }
    #contents_w .bankin .block h3 span{
        font-size: 110%;
    }
    .ttl_no{
        font-size: 18px;
        padding: 8px 18px;
    }
    .box_3 p{
        width: 32%;
    }
.txt.box3 span{
    font-size: 90%;
    }
    .card {
    margin: 17% auto 0;
    }


.bankin .block{ padding: 3.5%; }

/*-----------FAQ-----------*/
    .box_w.faq{
        margin:43px auto;
        width: 95%;
    }
.box_w.faq li i{ padding: 0.5% 1.8%; position: absolute; font-size: calc(1vw + 11px); }
.box_w.faq .que span{ width: 90%; margin-left: 12%; display:inline-block; }

/*--------BP SHOP--------*/
    .office img{ width: 90%; }
    .shop_bn h3.name{ font-size: calc(1vw + 15px); }
    .shop_bn .inner ul{ float: none; margin-bottom:20px; display: block; width: 100%; border-bottom: 3px solid #e6e6e6; padding-bottom: 25px;}
    .shop_bn .inner ul:nth-child(2n){ float: none; }
    .shop_bn .inner ul:nth-last-child(1){ margin: 0; }

    .shop_bn li.data {
        width: 59.5%;
    }
    .shop_bn li.image{
        width: 37%;
    }
    .shop_bn li.map {
        display: inline-block;
        width: 100%;
        height: auto;
        padding: 0;
        overflow: hidden;
    }
    .shop_bn li.map iframe {
        margin-top: 5px;
        width: 100%;
        height: 290px;
        border: none;
    }


    .office{
        font-size: 150%;
        line-height: 150%;
    }

    .shop_imgs li{
        width: 30.5%;
        margin: 1% 1%;
    }

    .bp_center {
        width: 88%;
        margin: 20px auto 0;
        height: auto;
        display: block;
        overflow: hidden;
        border-top: 1px solid #ddd;
        border-bottom: 1px solid #ddd;
    }
    .bp_center li{
        width: 100%;
        margin: 20px 20px;
    }
    .bp_center .img img {
    width: 93%;
    max-width: 210px;
    }
    #btm_blog_list {width: 100%;}
    #btm_blog_list ol li{ font-size: 115%; float: none; width: 100%; }
    #btm_blog_list p.date span{ margin-left: 8px;  }

    .p_mark{
        margin-top: 0px;
        padding-top: 10px;
        height: 88px;
        background: #fff;
        z-index: 2;
        position: relative;
    }
    .p_mark p{ margin-top: -10px; font-size: 85%; font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif; }
    #return_top{ bottom: 50px; }
    img.ttl_icon{ margin-top: -40px; }

    /* footer */
    #copyright address{
        width: 100%;
        text-align: center;
    }
    #copyright{
    margin: -50px 0 0;
    z-index: 2;
    position: relative
    }
    #footer_menu ul{ background: #fff; }
    #footer_menu li{ background: rgb(153, 153, 153); font-size: 120%; }
    #footer_menu li a{ font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif; }
    li#menu-item-98741 {
        display: inline-block;
        margin: -26px 0 0;
        width: 100%;
    }

}
@media only screen and (max-width:650px){
    #contents_w .bankin .block h3,
    #contents_w .bankin .block h3.line2{
        font-size: 170%;
    }
    .ct_1 .txt_area{ background-position: 50% 15px; background-size: 50% auto; }
    .ct_1 .txt_area p{ width: auto; padding-top: 16vw; }
}

@media only screen and (max-width:570px){
    #contents_w .bankin .block h3,
    #contents_w .bankin .block h3.line2{
        font-size: 130%;
    }
    div.hosyou p{
        font-size: 183%;
    }
    .kome{
        font-size: 85%;
    }

    /*---------カルーセル----------*/
    .cars_carousel{
        border-left: 1px solid #ccc;
        border-right: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
    }
    .cars_carousel .bxslider article {
        width: 100%;
        border: none;
        border-top: 7px solid #0074B9;
    }

    /*---------BP 詳細----------*/
    .bankin .block{
        height: auto;
    }
    li.block .ttl_no{ font-size: 16px; padding: 3px 13px; }
    li.block .inner{
        width: auto;
        padding: 3%;
    }
    li.block .inner2 {
        margin: 0;
        width: 100%;
        float: none;
        text-align: center;
    }
    li.block .inner2 img{
        margin: 0 auto;
        width: 75%;
    }
    #contents_w .bankin .block p.txt,.box_3{
        margin-top: 2%;
        margin-bottom: 3%;
        min-height: 0;
    }
    .box_3{
        margin-left:1%;
    }
    #contents_w .bankin .block p.txt.box3{
        margin-top: 0;
    }
    .card {
    margin: 3% auto 10px;
    }

    .ct_3 .box{ padding: 0 5%; }

    .ct_3 .item{ float: none; width: 100%; margin: 0; padding: 5% 0 5%; border-bottom: 4px solid rgb(226, 226, 226); }
    .ct_3 .item .name{ font-size: calc(1.5vw + 6px); }

    .ct_3 .item:nth-child(3){ border-width: 0; }

    /*----- BP shop-----*/
    .shop_imgs li {
        width: 46%;
    }
   .bp_center {
        width: 100%;
    }
    .bp_center .img {
        width: 54%;
    }
    .bp_center .txt{
        margin-left: 0;
    }
}

@media only screen and (max-width:540px){
    #contents_w .shop_bn h3{ width: 90%; margin: 0 auto; }
    .shop_bn li.data{ float: none; width: 80%; margin: 20px auto;  }
    .shop_bn li.image{ float: none; width: 80%; height: 42vw; margin: 0 auto; }
    .shop_bn li.map {
        text-align: center;
    }
    .shop_bn li.map iframe {
        margin: 0 auto;
        width: 80%;
        height: 60vw;
        border: none;
    }

}

@media only screen and (max-width:480px){
    .open.line2{
            display: block;
    }
    #contents_w h2{
        font-size: 110%;
        height: auto;
        text-indent: 10px;
    }
    #contents_w .bankin .block h3, #contents_w .bankin .block h3.line2 {
        width: 90%;
    }
    .br480{
        display: inline;
    }
    div.hosyou p{
        font-size: 137%;
    }

    .bp_center li{
        width: 100%;
        margin: 0 auto;
        padding-bottom: 20px;
        border-bottom: 1px dotted #ccc;
    }

    .bp_center .img{
        float: none;
        width: 80%;
        margin: 10px auto;
        text-align: center;
    }
    .bp_center .txt {
        float: none;
        width: 75%;
        font-weight: 600;
        color: #38619E;
        margin: 20px auto 10px;
    }
    .bp_center .txt p{
        font-size: 120%;
    }
    .bp_center p.name{
        font-size: 170%;
    }
    .bp_center .name span{
        text-indent: 0;
        font-size: 85%;
        margin-bottom: 3px;
    }
    .box_3 p {
        float: left;
        margin-right: 2px;
    }
    .shop_bn li.data{ float: none; width: 90%; }
    .shop_bn li.image{ float: none; width: 90%; }
    .shop_bn li.map iframe { width: 90%; }

}

@media only screen and (max-width:380px){

    #contents_w .bankin .block h3, #contents_w .bankin .block h3.line2 {
        line-height: 1.2
    }
    div.hosyou p {
    font-size: 110%;
    }
    .ct_2 .item{ float: none; width: 90%; }
    .ct_2 .item::after{ width: auto; }
    .ct_2 .item .image::after{ content:""; }
    .ct_2 .item .txt{ height: auto; }
    .ct_2 .item:nth-child(2n):after{ color: rgb(10, 161, 71); }

    .br380{
        display: inline;
    }
    .cach_copy {
        font-size: 110%;
    }
    .shop_bn p {
        font-size: 95%;
    }
    .shop_bn p span.name{
        margin-bottom: 3px;
    }
    .shop_bn p span.zip, .shop_bn p span.address{
        line-height: 1.3;
    }

    a.jump{ width: auto; float: none; }
    #btm_blog_list ol li{
        font-size: 105%;
    }
}