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

/*--------------------------共通項目-------------------------------------*/

@media screen and (min-width:960px) {
/*--------------- PC ---------------*/

html {}
body {font-size: 1.6rem; }

img {max-width: 100%; height: auto;}

.layoutbox100p {width: 100%; max-width: 100%; height: auto; margin: auto; position: relative;}
.layoutbox90p {width: 90%; max-width: 1280px; height: auto; margin: auto; position: relative;}
.layoutbox80p {width: 80%; max-width: 1280px; height: auto; margin: auto; position: relative;}
.layoutbox70p {width: 70%; max-width: 1280px; height: auto; margin: auto; position: relative;}
.layoutbox60p {width: 60%; max-width: 1280px; min-width: 980px; height: auto; margin: auto; position: relative;}

/*-------------- ~PC ---------------*/
}


@media screen and (max-width:959px) {
/*------------- Mobile -------------*/
html {}
body {font-size: 1.5rem;}

img{
max-width: 100%;
height: auto;
width /***/:auto;　
}

.layoutbox90p,
.layoutbox80p,
.layoutbox70p,
.layoutbox60p {
width: 92%;
margin: auto;
height: auto;
}
.layoutbox100p {width: 100%;}

/*------------ ~Mobile -------------*/
}


/*------------------------  ここから個別サイトごと  ------------------------*/	

/* header */
.header_wrap {
height:41vw /*calc(100vw - 60%)*/;
min-height: 490px;
max-height: 630px;
position: relative;
box-sizing: border-box;
max-width: 1440px;
margin:0 auto;
padding: 0;}



.header {background: url(../img/headImg_base.png) top center no-repeat;
background-size:100% auto ;
margin:20px;
padding: 0;
height: 100%;
position: relative;
}


.header_flex {display: flex;justify-content: space-between; align-items:center; padding-top: 15px;margin:0; }

.header_rogo {width: 330px; text-align: center; }
.header_rogo img {margin: 20px 30px 0 30px; width: 75%; min-width: 180px; height: auto; }
.header_rogo div {font-weight: 600;}

.header_ico {position: absolute; right: 0; top: 90px; right: 0; text-align: center; margin:0; font-size: 90%; }
.header_ico img {width:18%; height: auto; margin: 12px 12px 0;}

.index_ie { z-index: 1;}
.index_ie img {
width: 33%; height: auto;
position: absolute;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
-webkit- transform: translateY(-50%) translateX(-50%);}

.index_copy {text-align: center; margin-top: 15px; position: relative; z-index: 2;}
.index_copy img {margin: 3% 5px;}

.people {margin:-10px auto 0; display: block; max-width: 100%; height: auto; text-align: center; position: relative; z-index: 2;}
.people img { margin: auto; width:80%;}


@media screen and (max-width:959px) {
.header_wrap { 
height:50vw;
min-height: 330px;
max-height: 500px;}

.header {margin:10px;}

.header_rogo {margin: -5px 0px 0 -2px; width: 200px; }
.header_rogo img {width: 120px;height: auto;margin: 0px 5px; }

.header_ico {text-align: right;top: 70px; margin:0 10px 0 0; }
.header_ico img {margin: 12px 2px 0;}
.header_ico_txt {display: none;}

.index_ie { z-index: 1;}
.index_ie img { margin-top: 75px;}

.index_copy { margin-top: 23px;}
.index_copy img { }

.people {margin:50px auto 0}
.people img {width:96%; height: auto;}
}


/*------------ 共通 -------------*/

.header_wrap_comm {position: relative;box-sizing: border-box;max-width: 1440px;margin: auto;}

.header_comm {background: url(../img/headImg_comm.jpg) top no-repeat; background-size:100% auto ;margin:20px;margin:20px;
padding: 0;position: relative;}

.header_flex_comm {display: flex;align-items:center; padding-top: 15px; flex-wrap: wrap;}

.comm_copy {margin-top: 0; width: 70%;z-index: 2;}

.header_ico_comm {position: absolute; right: 0; top: 125px; right: 16px; text-align: right; margin:0; font-size: 90%; }
.header_ico_comm img {width: 18%; height: auto;margin: 12px 12px 0;}

.header_flex2_comm {display: flex; align-items: center; width: 100%; margin: 0; padding: 0;}
.comm_title_wrap {width: 35%; text-align: center; margin-top: 10px;}
h2.comm_title { background-size:100% 100%; padding:10px; white-space: nowrap; display:inline-block; color: #fff; text-shadow: 2px 2px 5px #555; min-width: 280px;}

.comm_people {width: 62%; text-align: right; margin: -20px 10px 0 0;}
.comm_people img {}



@media screen and (max-width:959px) {
.header_wrap_comm {height:50vw;min-height: 330px;max-height: 500px;}

.header_comm {margin:10px;}
.header_flex_comm { flex-wrap: wrap;}

.comm_copy {padding-top: 15px; width: 100%;z-index: 2;}


.header_ico_comm { top:20px; margin:45px 10px 0 0; right: 0; text-align: right;  }
.header_ico_comm img {margin: 12px 2px 0;}
.header_ico_txt {display: none;}

.header_flex2_comm {display: block; position: relative;}
.comm_title_wrap {width: auto; text-align: center; 
position: absolute;
top:77px;
left: 50%;
transform: translateX(-50%);
-webkit- transform: translateX(-50%);
}
h2.comm_title {padding:8px 10px; width: 80%; display:inline-block; font-size:100%;}

.comm_people {
width: 70%;
position: absolute; 
top:10px;
left: 50%;
transform: translateX(-50%);
-webkit- transform: translateX(-50%);
 z-index: 1;}
.comm_people img {}
}













/*<!--ハンバーガーメーニュー部のPC時はモバイル非表示-->*/
@media screen and (min-width:960px) {
.hamburger {/* display : none;*/}
}
/*メニュー　PCのみ。モバイルはburger_menu.cssで*/
@media screen and (min-width:960px) {
ul.menu {display: flex; justify-content: space-around; margin: 20px auto 70px; padding: 12px 0;width: 90%; font-size: 90%; box-shadow: 0 5px 10px #eee; border-radius: 20px;background: url("../img/bg_header.jpg"); }
ul.menu li:first-child { border-left: none; }
ul.menu li {list-style: none; width: 100%; margin: 0; padding: 0; text-align: center; border-left: dashed 1px #432500; }
ul.menu li a {padding: 4px 8px;margin:0 ; color: #432500;display: block; white-space: nowrap; line-height: 1.2; text-shadow: 1px 1px 1px #fff;}
ul.menu li a span {font-size: 80%; display: block; margin: 0; padding: 0;color: #6A4A4A ;}
}





/* footer */
.footer {background: url("../img/footer_bg.jpg") top center no-repeat; background-size: cover; min-height: 400px; padding: 60px 0 0 0;max-width: 1600px;
margin: auto;}
.footer_logo {text-align: center; margin-top:50px; } 
.footer_ico { text-align: center; margin-top:80px; }
.footer_ico img {width:18%; height: auto;margin: 12px 12px 0;}

ul.footer_menu {margin-top: 30px;} 
ul.footer_menu li {list-style: none; list-style: url("../img/tips2.png")}
ul.footer_menu li span {display: none;}

@media screen and (max-width:959px) {
.footer {min-height:220px; padding: 30px 0 0 0;}
.footer_logo {text-align:left;margin: 0;font-size: 85%;}
.footer_logo img {width: 150px; height: auto;}
.footer_ico { text-align: center; margin-top:10px; }
.footer_ico img {width:18%; height: auto;margin: 6px 6px 0;}
ul.footer_menu {display: none;}
}
