@charset "utf-8";

#main {
position: relative;
z-index: -10;
}
.mv_area { margin:2em 4em;
}
.mv_ttl {
position: absolute;
margin: 0 20.3%;
top: 370px;
width: auto;
z-index: 1;
}

.read {
margin:12em 11.2% 4em;
font-weight:bold;
}

h2.headtxt {
position: relative;
margin:2em auto 1em;
font-weight: bold;
font-size: 2.4em;
line-height: 1.4;
}
h2.headtxt:before {
content: "";
display: block;
width: 80px;
height: 28px;
margin: 0 auto 10px;
background-size: cover;
background-image: url("../img/txt_item2.png");
}
h3.headtxt {
margin:4em auto 1.2em;
padding: 0;
font-weight: bold;
font-size: 2.4em;
line-height: 1.4;
width: 40%;
}

p.suptxt {
text-align:center;
font-size: large;
}
p.notetxt {
text-align:center;
color: #222785;
}

#bnr_area {
position: relative;
width: 60%;
margin: 8em auto 4em;
}
.bnr_subtxt {
position: absolute;
margin: 0 28.5%;
top: -28%;
z-index: 1;
}
.shadow {
border-radius: 20px;
box-shadow: 1px 3px #ccc;
}

#bnr_area_multi {
position: relative;
width: 100%;
margin: 2em auto;
}
ul.bnr_btn {
display: flex;
}
ul.bnr_btn li {
width: calc(45% - 10px);
margin-left: 40px;
}

#link_area {
width: 60%;
margin: 0 auto 2em;
}
#link_area a.arrow {
position: relative;
vertical-align: middle;
}
.link_site {
background: #cca372;
padding: 1.4em;
text-align: center;
color: #fff;
font-weight: bold;
font-size: xx-large;
}
.link_site:after {
content:"　";
margin: 0 0 0 10px;
background-size: 80%;
background-image: url(../../../common/arrow_out.png);
background-repeat: no-repeat;
background-position: center;
}

.box_highlight {
position: relative;
margin: 4em auto;
background-size: 100%;
background-image: url("../img/txt_item3.png");
background-repeat: no-repeat;
background-position: center;
width: 60%;
height: 286px;
}
.box_highlight h4 {
position: absolute;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
text-align: center;
color: #222785;
font-size: larger;
}



@media screen and (max-width:768px) {
/* 打ち消しここから */
header #h_area .logo_b { width: 34.30%;}
#main {padding: 0;}
/* 打ち消しここまで */

.mv_area {
width: 130%;
margin: 0 -13%;
}
.mv_ttl {
margin: 0 6.24%;
top: 54%;
width: auto;
}

.read {margin:4em 9.36% 3em}

h2.headtxt {font-size: larger;}
h3.headtxt {
margin: 2em auto 1em;
width: 63.5%;
padding: 0;
}

p.suptxt {
text-align: left;
font-size: medium;
}
p.notetxt {}

#bnr_area {width:90%;}

#bnr_area {}
.bnr_subtxt {}
.shadow {}

#bnr_area_multi {}
ul.bnr_btn {display: block;}
ul.bnr_btn li {
width: calc(90% - 0px);
margin: 0 20px 20px;
}

#link_area {width: 90%;}
#link_area a.arrow {}
.link_site {font-size: medium;}
.link_site:after {}

.box_highlight {
width: 90%;
margin: 0 auto;
}
.box_highlight h4 {
font-size: small;
width: 60%;
}

}