@charset "UTF-8";

/*===============================================
●共通
===============================================*/



/*===============================================
●画面の横幅が641px以上(タブレット・PC)
===============================================*/
@media screen and (min-width: 641px) {

#det{
    float:right;
    width:730px;
    padding-bottom:40px;
    background-color:#FFF;
}

/* h2 */
h2{
    width:730px;
    height:40px;
    margin:0px auto 0px auto;
    padding:14px 0px 0px 25px;
    font-size:16px;
    font-weight:bold;
    color:#FFF;
    text-align:left;
    background-color:#069;
}

/* det_box */
.det_box {
    width:700px;
    margin:0px auto;
    font-size:14px;
    }

h3{
    width:700px;
    margin:20px auto 0px auto;
    padding:12px 20px 8px 20px;
    font-size:18px;
    font-weight:bold;
    color:#FFF;
    text-align:left;
    background-color:#8cc63f;
    line-height: 140%;
}

.det_box div.sns {
    width:660px;
    margin:10px auto 0px auto;
    text-align:right;
    }

.det_box div.det_txt01 {
    width:660px;
    margin:20px auto;
    line-height:180%;
    }

.det_box div.det_img {
    width:660px;
    margin:40px auto 0px auto;
    }

.det_box div.det_img ul li {
    float:left;
    width:210px;
    margin:0px 15px 0px 0px;
    }

.det_box div.det_img ul li:last-child {
    margin:0px;
    }

.det_box div.det_img ul li img {
    width:210px;
    }

.det_box div.det_map {
    width:660px;
    margin:40px auto 0px auto;
    }

.det_box div.det_map p {
    color:#099;
    }

.det_box div.det_map p img {
    margin:2px 8px 0px 0px;
    }

.det_box div#gmap {
    width:660px;
    height:300px;
    margin:10px 0px 0px 0px;
    border: 2px solid Gray;
    }


    #video {
        width: 500px !important;
        margin: 0px;
    }



}

/*===============================================
●画面の横幅が640px以下(スマホのみ)
===============================================*/
@media screen and (max-width: 640px) {

/* 共通 */
body {
    background:none;
}

#det{
    width:100%;
    margin:0 auto 40px auto;
}

/* h2 */
h2{
    width:100%;
    height:40px;
    margin:10px auto 0px auto;
    padding:14px 0px 0px 25px;
    font-size:16px;
    font-weight:bold;
    color:#FFF;
    text-align:left;
    background-color:#069;
}

/* det_box */
#det_box {
    width:100%;
    margin:0px auto;
    font-size:14px;
    }

h3{
    width:100%;
    margin:20px auto 10px auto;
    padding:12px 10px 8px 10px;
    font-size:16px;
    font-weight:bold;
    color:#FFF;
    text-align:left;
    background-color:#8cc63f;
    line-height: 140%;
}

.det_box div.sns {
    width:100%;
    margin:10px auto 0px auto;
    text-align:right;
    }

.det_box div.det_txt01 {
    width:100%;
    margin:20px auto;
    line-height:180%;
    }

.det_box div.det_img {
    width:100%;
    margin:40px auto 0px auto;
    }

.det_box div.det_img ul li {
    width:100%;
    margin:0px 0px 20px 0px;
    }

.det_box div.det_img ul li:last-child {
    margin:0px;
    }

.det_box div.det_img ul li img {
    width:100%;
    }

.det_box div.det_map {
    width:100%;
    margin:40px auto 0px auto;
    }

.det_box div.det_map p {
    color:#099;
    }

.det_box div.det_map p img {
    margin:2px 8px 0px 0px;
    }

.det_box div#gmap {
    width:100%;
    height:200px;
    margin:10px 0px 0px 0px;
    border: 2px solid Gray;
    }


    #video {
        width: 100% !important;
    }

}