@charset "UTF-8";

/*全般的なスタイル*/

img{width:100%;}
figure{overflow:hidden; }
div{overflow:hidden;}
a{margin: auto;}
*{ letter-spacing:0.1rem ; font-size: 1vw; overflow-wrap:break-word; color: gray; font-family: 'Lato', 'Noto Sans JP', '游ゴシック Medium', '游ゴシック体', 'Yu Gothic Medium', YuGothic, sans-serif;}
h1 {font-size: 1.5vw;}
.banner {width: 100%;display:flex;flex-wrap: wrap;}
.banner a{margin: 0px 0px 5px 0px; width: 50%;}
.banner img{width: calc( 100% - 2px);}
.centering {text-align: center;}
.img_under {margin-bottom: 3em;}

#leftside{text-align: center; min-width: 135px; overflow-x: hidden;}
#rightside{text-align: center; min-width: 135px;}

.headline {width: 100%; margin-top: 2vw;}
.foot_line {margin-top: 3vw;}

.fb {text-align: center;}
.facebook-wrapper {max-width: 500px; margin: auto;}
.facebook-wrapper > .fb-page {width: 100%; text-align: center;}
.facebook-wrapper > .fb-page > span,.facebook-wrapper iframe {width: 100% !important;}

.per {display: flex; border-style: groove; border-width:6px; margin-top: 1rem;}
.staff {margin: auto;}
.stf1 {width:20%;}
.stf2 {width:25%; font-size: 1.2rem; text-align:center;}
.stf3 {width:30%; font-size: 0.8rem;}
.stf4 {width:25%;}

#sns {text-align: center;}
/*.sns {margin: 0 auto 0.5rem auto; width: 45%;}*/
.sns {margin: 0 auto 0.5rem auto; width: 31%;}
.sns p {margin: 0;}
.sns p img {width: 70%;}

    /*ヘッダ*/
figure{margin:5px; width: 80%;}
#line{height:10px; width:100%; background-image:url("https://gaians.xsrv.jp/img/top/under001.png") ; margin-bottom: 10px;}

/*モバイル*/
@media screen and (max-width:750px) {
*{font-size: 2.5vw; }
h1 {font-size: 4vw;}
#pagebody {display: flex; flex-direction: column; padding-top: 10px;}
#main {order:1 !important;}
#leftside {order:2; }
#rightside {order:3; }
#banner {display: none;}
#leftside img {width:40%}
#rightside img {width:40%}
.small_headline {width: 50%; margin: 5vw 10% 0% 10%; height: 10vw; }
.large_headline {margin-top: 5vw;}
#gaiakun {display: none;}
.pc { display: none;}
.sp { width: 100% !important; margin:2rem auto 0rem auto;}
#l_list a {font-size: 1rem;}
/*.logo {width: 24% !important;}*/

/*
#sns {margin: 0 5%;}
#instagram {width: 100%; max-width: 300px; margin: 0 auto;}
#twitter {width: 100%;}
*/
.sns {width: 49%;}
#line_sns_pc {display: none;}

    /*ヘッダ*/
img.menu {width:30%;}
#head1-2 {display:flex; align-items:center;}
#head2 {text-align: center;}

.flex_text {height:12vw; overflow:hidden; font-size: 3vw; line-height: 6vw; margin: 0vw; width: 100%; font-family: 'Lato', 'Noto Sans JP', '游ゴシック Medium', '游ゴシック体', 'Yu Gothic Medium', YuGothic, sans-serif;}

    /*スライド*/
.fb-container {width: 100%;max-width: 500px;}
.bx-wrapper{margin-bottom: 0 !important;}

    /*GoogleMap*/
#gmap {height: 20rem; position: relative;}
#gmap iframe {height: 100%;}

}


/*デスクトップ*/
@media screen and (min-width:751px) {
body{margin: 0% 14% 0% 14%;}
#leftside{width: 20%;}
#rightside{width: 22%;}
#pagebody{display: flex; flex-direction: row; padding-top: 10px;}
#main{width: 55%; margin: 0% 3% 0% 3%;}
#content{width: 100%;}
.sp {display: none;}
.pc { width: 100%; margin: auto;}
.logo {width: 48%;}

#rightside img{margin: 0.5vw 0px 0px 0px ;}
#leftside img{margin: 0.5vw 0px 0px 0px ;}
#leftside .small_headline {margin: 1.5vw 0px 0px 0px; }
#rightside .small_headline {margin: 1.5vw 0px 0px 0px; }
.large_headline {margin-top: 2vw;}
.banner {width: 100%;display:flex;flex-wrap: wrap;}
.banner a{margin: 0px 0px 5px 0px; width: 33%;}
div.banner {display: flex;flex-direction: row;}
.flex_text {height:10vw; overflow:hidden; font-size: 1vw; line-height: 2.5vw; margin: 0vw; width: 100%; font-family: 'Lato', 'Noto Sans JP', '游ゴシック Medium', '游ゴシック体', 'Yu Gothic Medium', YuGothic, sans-serif;}
#l_list li {font-size: 1rem;}
#line_sns_sp {display: none;}

/*
#sns {display: flex; flex-direction: row; margin: 1rem 5%;}
#instagram {width: 50%;}
#twitter {width: 50%;}
*/
    /*スライド*/
.fb-container {width: 500px;}
.bx-wrapper{ margin-bottom: 1rem;}

    /*ヘッダ*/
#head1 {display:flex; flex-direction:row;}
#head1-1 {display:flex;margin: auto;}
#head1-2 {display:flex; flex-direction:column;margin: auto;}
#head2 {display:flex; flex-direction:row; text-align: center;}

    /*GoogleMap*/
#gmap {height: 20vw; position: relative;}
#gmap iframe {height: 100%;}

}