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

/*PC*/
@media print, screen and (min-width: 769px) {



/**********************************
movie
**********************************/
#mv {
width: 100%;/* // 横幅もいっぱいに。*/
height: auto;
overflow: hidden;
min-width: 1200px;
/*display: flex;
align-items: center;
justify-content: center center;*/
margin:  0 auto;
position: relative; 
min-height: 660px;
background: url(../images/contents/movie_cover.jpg) center center;
background-repeat: no-repeat;
background-size: cover;
}

#mv video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: auto;
min-width: 100%;
min-height: 100%;
max-width: inherit;
background-position: center center;/* // positionも中央に。*/
background-size: cover;/* // 画面サイズに応じてサイズを可変するように設定。*/
/*	// 以下、画面いっぱいにするためのCSS設定*/
/*// wrapperのサイズに応じて、leftの位置をjQueryで指定するため、positionはabsoluteにします。*/
/*// z-indexは調整してください。*/
z-index: 1;
}



.hed_slider {
width:100%;
position:relative;
}

#photograph {
position:relative;
width: 100%;
height:2000px;
margin:-100px 0 0
}


.main_catch {
position:absolute;
bottom: 100px;
left: 100px;
/*-webkit-transform: translate(-50%,-50%);
-moz-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
-o-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);*/
margin: auto;
z-index:200;
}

.main_catch img {
width:100%;
height:auto;
}

.main_logo {
width: 450px;
}

.main_logo img {
width: 100%;
height: auto;
}


.scroll {
bottom: 15px;
left: 50%;
margin-left: -18px;
position: absolute;
z-index: 200;
}



/*-----banner------*/
.banner_box{ display: flex; flex-wrap: wrap; justify-content: space-between; list-style: none; margin: 0 0 100px; }
.banner_box li{ width: 28%; margin-top: 50px; }


/*-----news------*/
#news{margin: 100px auto;}
#news .com_contents .comTitle1{line-height: 40px;}
#news .itm_box{display: flex;gap:0 10px;}
#news .itm_box img{width: 100%;}

/*-----message------*/
#message{ margin: 100px 0 0; background: url(../images/com/a.png) 0 0 repeat;
padding: 100px 0 100px; }
#message .message_box{ width: 1000px; margin: auto; background: #fff; padding: 50px 80px; box-sizing: border-box; border: 5px solid #c2b095; }
#message .message_box .message_flex{ display: flex; flex-wrap: wrap; justify-content: space-between; flex-direction: row-reverse; }
/*#message .message_box .message_flex .pre_img{ width: 20%; }*/
#message .message_box .message_flex .pre_txt{ width: 100%; margin-bottom: 20px;}
#message .message_box .pre_name{ margin-top: 50px; text-align: right;font-weight: 700; }




/*-----bg_com01------*/
.idx_box { width: 100%; margin: 0 auto 150px; }
.idx_box .idx_flex { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; }
.idx_box .idx_flex.flex_r { flex-direction: row-reverse; }
.imgbox { width: 48%; }
.imgbox { width: 48%; box-shadow: 5px 5px 20px -5px #c2b095; }
.imgbox img { width: 100%; height: auto; }
.txtbox { width: 48%; }
.txtbox .logo_flex { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; margin-bottom: 30px; }
.txtbox .logo_flex p { width: 20%; margin: 0 50px; }
.txtbox .logo_flex p.w30 { width: 30%; }




/*-----area------*/
#area { width: 100%; margin: 100px auto; }
.area_box { display: flex; flex-wrap: wrap; justify-content: space-between; width: 1000px; margin: auto; }
.area_box .map_img { width: 55%; }
.area_box ul { width: 38%; }
.area_box ul li { margin-bottom: 30px; list-style: decimal; font-weight: 900; border-bottom: 1px solid #c2b095; }
.area_box ul li a { color: #333; }
.area_box ul li a:hover { color: #c2b095; }




}


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

.pc {
display: none;
}



.hed_slider {
width:100%;
position:relative;
}

#photograph {
width: 100%;
height:700px;
}

.main_catch {
position:absolute;
bottom: 70px;
left: 20px;
/*-webkit-transform: translate(-50%,-50%);
-moz-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
-o-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);*/
margin: auto;
z-index:200;
}

.main_catch img {
width:100%;
height:auto;
}

.main_logo {
width: 80%;
}

.main_logo img {
width: 100%;
height: auto;
}


.scroll {
bottom: 15px;
left: 50%;
margin-left: -18px;
position: absolute;
z-index: 200;
}




/*-----banner------*/
.banner_box{ display: flex; flex-wrap: wrap; justify-content: space-between; list-style: none; margin: 0 0 50px; }
.banner_box li{ width: 48%; margin-top: 30px; }


/*-----news------*/
#news{margin:50px 0 0; }
#news .com_contents .comTitle1{line-height: 20px;}
#news .itm_box{display: flex;flex-wrap: wrap; gap:10px;}
#news .itm_box img{width: 100%;}

/*-----message------*/
#message{ margin: 50px 0 0; background: url(../images/com/a.png) 0 0 repeat;
padding: 50px 0; }
#message .message_box{ width: 98%; margin: auto; background: #fff; padding: 30px 20px; box-sizing: border-box; border: 5px solid #c2b095; }
#message .message_box .message_flex{  }
#message .message_box .message_flex .pre_img{ text-align: center; margin-bottom: 20px; }
#message .message_box .message_flex .pre_txt{  }
#message .message_box .pre_name{ margin-top: 20px; text-align: right; }




/*-----bg_com01-----*/
.idx_box { width: 100%; margin: 0 auto 100px; }
.idx_box .idx_flex {  }
.imgbox { margin-bottom: 30px; }
.imgbox { box-shadow: 5px 5px 20px -5px #c2b095; }
.imgbox img { width: 100%; height: auto; }
.txtbox {  }
.txtbox .logo_flex { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; margin-bottom: 20px; }
.txtbox .logo_flex p { width: 20%; margin: 0 20px; }
.txtbox .logo_flex p.w30 { width: 35%; }




/*-----area------*/
#area { width: 100%; margin: 50px auto; }
.area_box .map_img { margin-bottom: 30px; }
.area_box ul { padding-left: 1em; }
.area_box ul li { margin-bottom: 30px; list-style: decimal; font-weight: 900; border-bottom: 1px solid #c2b095; }
.area_box ul li a { color: #333; }
.area_box ul li a:hover { color: #c2b095; }




.com_btn { margin: 0 auto; }


}
