@charset "UTF-8";
/* CSS Document */
*,
*:before,
*:after {
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
}

html {font-size:18px; font-family: Noto Sans JP,sans-serif;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;}

body {font-size: 16px; line-height: 1.8em;}
body img {width:100%; height:auto;}


body.top {}
a {color: #fed327;}
a:hover{ opacity: 0.8;}

h4{font-size:1.4em; font-weight: bold; margin:0.4em 0 0.4em 0; border-bottom: #000 1px solid; display: block;}

.flex_box{display: flex; align-items:stretch; justify-content:center; flex-wrap: wrap;}

/*language*/
.language {display: block; position: absolute; right: 0; top:0; font-size: 0.8em;}
.language a{display: block; float: right; margin-right:10px; padding: 3px 5px; border: #000 1px solid; border-top: none; background:#fff; color: #000;}
.language a.on{background-color:#000; color:#fff;}
/**/

header { background: url("../img/top_bg.png") no-repeat center 0 / cover;}
header h1 { width:390px; margin:60px 20px;}
header .topimg {width:800px;/*→880px*/ margin:60px 0; display: flex; align-items:stretch; justify-content:center; flex-wrap: wrap;}
header .topimg a img{width:650px;}
header .topimg a {display: block;}
header .topimg a.arrow {height:100%; }
header .topimg a.arrow img{width:26px; height:52px; margin: 158px 20px 0 20px;}
body.inpage {}
body.inpage header {}
body.inpage header h1 { width:160px; margin:0 auto; padding: 20px 0;}
/*en*/
body.en header { background: url("../img/top_bg.png") no-repeat center 0 / cover;}
body.en header h1 { width:900px; margin:60px 0;}
body.en header .topimg {width:100%; margin:0 0 30px 0; background-color: rgba(0,0,0,0.20);
    display: flex; align-items:stretch; justify-content:center; flex-wrap: wrap;}
body.en header .topimg a img{width:650px;}
body.en header .topimg a {display: block;margin:0 auto;}
body.en header .topimg a.arrow {height:100%; }
body.en header .topimg a.arrow img{width:26px; height:52px; margin: 158px 20px 0 20px;}
body.en.inpage header h1 { max-width:460px; margin:0 auto; padding: 20px 0;}
/****/

.topics {background: #000 url("../img/topics_bg.jpg") no-repeat center 0 / cover; width:100%; text-align: center;
    border: #000 solid;
    border-width: 8px 0;}
.top_intitle {max-width:420px; margin: 0 auto 40px auto; padding:60px 24px 0 24px;}
.topics .flex_box { max-width:1095px; margin:0 auto;}
.topics .flex_box a{ color: #000;}
.topics .box .box_img {height:194px; background: #eee url("../img/top_bg.png");
    display: flex;
    justify-content: center;
    align-items: center;}
.topics .box {width:345px; border: #beb7b0 1px solid; margin: 10px; background: #fff;}
.topics .box h2 {display:block; padding: 15px 20px; text-align: left; font-size: 0.97em; line-height: 1.5em;}
.topics .box.blank {background:none; border: none; }

.inpagebase {background: #000 url("../img/topics_bg.jpg") no-repeat center 0 / cover; width:100%; text-align: left;}
.inpagebase .flex_box { max-width:1200px; margin:0 auto;}
.inpagebase .inpage_menu {width:100%; color: #fff; padding:16px 32px;}
.inpagebase .inpage_menu a{ color: #fff;}
.inpagebase .box img{width:auto; max-width:100%;}
.inpagebase .box {width:100%; border: #beb7b0 1px solid; background: #fff; padding: 40px 32px 60px 32px; margin-bottom:80px;}
.inpagebase .box p{ padding-bottom:1em;}
.inpagebase .box a{ color: #6C3603; font-weight: bold;}
.inpagebase .box a:hover{ color: #7D580A;}
/*a deco*/
.inpagebase .box a{ position: relative;display: inline-block;transition: .3s; padding:1px;}
.inpagebase .box a::after {position: absolute;bottom: 3px;left: 50%; width: 0; height: 2px; content: ''; background-color: #7D580A; transition: .3s; transform: translateX(-50%);}
.inpagebase .box a:hover::after{width: 100%;}

.inpagebase .box h3 {display:block; padding: 0 0 40px 0; text-align: left; font-size:42px; font-weight: bold; line-height: 1.4em;}

.pages  {color:#fff; font-size: 1.2em; padding: 45px 0 80px 0;}
.inpage .tablebox {border:1px solid #000; padding:0 20px; font-size: 1.2em; line-height: 1.6em; text-align: center;}
.inpage .tablebox h3{text-align: center; padding:0; margin: 0; font-size: 30px;}
.inpage .tablebox h3 span{font-weight: normal; font-size: 0.5em; display: block;}
.inpage .tablebox h4{font-size:1.2em; margin:20px 0;}
.inpage .tablebox div {display: block;margin:0 auto;}

.inpage .textbox {border:1px solid #000; padding:20px 24px 10px 24px; margin: 0 0 20px 0;}

/*ボタン設置*/
.btn_cover {margin-top:1em;}
.btn_cover .btn,
.btn_cover a.btn,
.btn_cover button.btn {
  font-size: 1em;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 0.8em 1.6em;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5em;
}
.btn_cover a.btn-border {
  border: 2px solid #000;
  border-radius: 0;
  background: #fff;
}
.btn_cover a.btn-border::after{height:0;
}

.btn_cover a.btn-border:hover {
  color: #fff;
  background: #7D580A;
  border-color: #7D580A;
}
/****/

/*区切り*/
section {border-top:#000 1px solid;padding-top:1em;}
/****/


footer {text-align: center; background: url("../img/foot_bg") no-repeat center 0 / cover;}
footer .footmenu p{margin:28px 20px 55px 20px;}
footer p.bg_box {height:fit-content; background: #000; margin: 12px; padding: 0 10px; color: #fff;}
footer a {color: #000;font-weight: bold; display: block;}
footer a:hover{ color:#6C3603;}
footer .com img{height:54px; width: auto; padding: 0 40px 0 10px;}

footer .copyright{font-size:0.8em; color:#666; margin:35px 0 20px 0;}

@media screen and (max-width:1500px) {
header h1 { margin-bottom:0px;}
}
@media screen and (max-width:900px) {
body.en header h1 {width: 100%;}
}
@media screen and (max-width:790px) {
.language {font-size: 0.4em; line-height: 1.4em;}
.language a{margin-right:5px; padding: 4px 8px;}
    
header h1 {width: 100%;margin: 30px 20px;}
header .topimg {width:100%; margin: 0 0 28px 0;}
header .topimg a.arrow { display: none;}
header .topimg a img{width:100%;}
.top_intitle { margin: 0 auto 30px auto; padding:50px 24px 0 24px;}
    
.inpagebase .box h3{font-size:32px;}
/*en*/
body.en header h1 {width: 100%;margin: 30px 10px;}
body.en header .topimg {width:100%; margin: 0 0 28px 0;}
body.en header .topimg a.arrow { display: none;}
body.en header .topimg a img{width:100%;}
/****/
footer .footmenu p{margin:28px 20px 34px 20px;}
footer p.bg_box {margin: 12px 12px 12px 32px;}
footer .com img{height:54px; padding: 0 0 0 10px;}
footer .com.flex_box {justify-content: left;}
footer .com.flex_box .flex_box {margin-bottom:26px;}
footer .copyright{margin:0 0 40px 0;}
/*en*/
body.en footer p.bg_box {margin: 12px 0 12px 24px;}
/****/
}