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

html, body,
h1, h2, h3, h4, h5, h6,
a, p, span,
em, small, strong,
sub, sup,
mark, del, ins, strike,
abbr, dfn,
blockquote, q, cite,
code, pre,
ol, ul, li, dl, dt, dd,
div, section, article,
main, aside, nav,
header, hgroup, footer,
img, figure, figcaption,
address, time,
audio, video,
canvas, iframe,
details, summary,
fieldset, form, label, legend,
table, caption,
tbody, tfoot, thead,
tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
}
html {
  -webkit-text-size-adjust: 100%;
}

body {
	font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Segoe UI', YuGothic, 'Yu Gothic Medium', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', Meiryo, sans-serif;
    color:#626b71;
    text-align:justify;
    min-width:1200px;
    line-height:20px;
}
a {
    color:#000;
    text-decoration:none;
}
a.text:hover {
    opacity: 0.6;
}
/* フォントサイズ */
h1 {
	font-size:120%;
	font-weight:600;
    margin-bottom:20px;
}
h2 {
    font-size:100%;
    font-weight:100;
}
.small {
    font-size:90%;
}
h4 {
    font-size:130%;
    text-align:center;
    margin-bottom:30px;
}
h5 {
    font-size:130%;
    font-weight:600;
    margin-bottom:20px;
}
.small {
    font-size:90%;
}
.middle {
    font-size:130%;
    margin-bottom:10px;
}
.br-sp {
	display:none; 
}
.br-pc {
	display:block; 
}

.main_bg {
    width:100%;
	height:auto;
    overflow:hidden;
    background-color:#bdc7cd;
    background-image: url(../images/top_bg.jpg);
    background-repeat: no-repeat;
    background-size: 1200px 888px;
    background-position: top center;
    position:relative;
}

.common_wrap {
    width:1180px;
    height:auto;
    margin:820px auto 0;
    overflow:hidden;
}

.main_wrap {
    width:725px;
    height:193px;
    margin:830px auto 0;
    overflow:hidden;
    display:block;
}


.main_wrap img {
    width:100%;
    vertical-align: bottom;
    display: block;
}

    .sp_main_wrap {
        display:none;
    }
.main_wrap_2 {
    width:725px;
    margin:80px auto 0;
    overflow:hidden;
}


.main_wrap_2 img {
    width:100%;
    margin-bottom:-5px;
}

.main_wrap_3 {
    width:725px;
    margin:80px auto;
    overflow:hidden;
}
.main_wrap_3 img {
    width:100%;
}

.main_wrap_15 {
    width:725px;
    margin:0 auto 10px;
    overflow:hidden;
    background-image: url(../images/fig_3_bg.jpg);
    background-repeat:no-repeat;
    background-size: cover;
}
.main_wrap_4 {
    width:725px;
    margin:0 auto;
    overflow:hidden;
    text-align:center;
    padding-top:50px;
}
.main_wrap_4 img {
    width:80%;
    margin-bottom:-5px;
}
.main_wrap_5 {
    width:725px;
    margin:0 auto;
    overflow:hidden;
    text-align:center;
    padding:0 0 50px;
}
.main_wrap_5 img {
    width:30%;
}
.main_wrap_6 {
    width:725px;
    margin:0 auto;
    overflow:hidden;
    text-align:center;
    padding:0 0 50px;
}
.main_wrap_6 img {
    width:30%;
}
.main_wrap_7 {
    width:725px;
    margin:0 auto;
    overflow:hidden;
    background-color:#77b7d6;
    text-align:center;
    padding:50px 0;
}
.main_wrap_7 img {
    width:80%;
}
.main_wrap_8 {
    width:725px;
    margin:0 auto 80px;
    overflow:hidden;
    background-color:#77b7d6;
    text-align:center;
    padding:0 0 50px;
}
.main_wrap_8 img {
    width:30%;
}

.main_wrap_10 {
    width:725px;
    margin:0px auto 0;
    overflow:hidden;
    background-color:#f7f7f7;
    color:#626b71;
}
.main_wrap_11 {
    width:725px;
    margin:0 auto;
    overflow:hidden;
    display:block;
}
.main_wrap_11 img {
    width:100%;
    vertical-align: bottom;
    display: block;
}
.main_wrap_12 {
    width:725px;
    margin:0 auto;
    overflow:hidden;
    display:block;
    position:relative;
}
.main_wrap_12 img {
    width:100%;
    vertical-align: bottom;
    display: block;
}
.main_wrap_13 {
    width:100%;
    margin:0 auto;
    overflow:hidden;
    background-image: url(../images/fig_2_bg.jpg);
    background-repeat:repeat-x;
    background-size: 100% 100%;
    background-position: center center;
}
.main_wrap_14 {
    width:100%;
    height:auto;
    margin:0 auto;
    overflow:hidden;
    position:relative;
}
.main_wrap_14 img {
    width:100%;
}
.three_block {
    width:549px;
    margin:0 auto;
    overflow:hidden;
}
.one_block {
    width:725px;
    margin:0 auto;
    overflow:hidden;
    position:relative;
}
.one_block img {
    width:80%;
}
.three_box {
    width:183px;
    float:left;
    position:relative;
}
.one_block_2 {
    width:528px;
    height:auto;
    margin:0 auto 10px;
    overflow:hidden;
    background-color:#fff;
    border-radius:0 0 10px 10px;
}
.three_box img {
    width:100%;
}
.three_box_txt_1 {
    width:80%;
    position:absolute;
    top:60%;
    left:10%;
}
.three_box_txt_1 p {
    font-size:70%;
}
.one_box_txt_1 {
    width:90%;
    margin:0 auto 30px;
}
.one_box_txt_1 p {
    font-size:70%;
}
.two_box {
    width:321px;
    float:left;
    position:relative;
}
.two_box img {
    width:100%;
}
.two_box_2 {
    width:265px;
    margin-left:98px;
    float:left;
}
.two_box_2 img {
    width:100%;
}
.two_box_3 {
    width:264px;
    margin-right:98px;
    float:left;
    position:relative;
}
.two_box_3 img {
    width:100%;
}
.two_box_txt_1 {
    width:80%;
    position:absolute;
    top:60%;
    left:10%;
}
.two_box_txt_2 {
    width:27%;
    position:absolute;
    top:10%;
    left:55%;
    text-align:left;
}
.two_box_txt_2 p {
    font-size:70%;
}
mark {
  background-color: #bbdced;
}





.text_block_1 {
    width:70%;
    margin:0 auto 20px;
}
.text_block_1 p {
    font-size:70%;
    font-size-adjust: none !important;
    -webkit-font-size-adjust: none !important;
}
.text_block_2 {
    width:200px;
    position:absolute;
    top:3%;
    left:22%;
    font-size:100%;
    font-weight:600;
    color:#022f64;
}

.position_wrap {
    width:100%;
    height:auto;
    overflow:hidden;
    position:relative;
    margin-bottom:10px;
}
.wh_bg {
    width:100%;
    height:24px;
    position:absolute;
    bottom:0%;
}
.wh_bg_top {
    width:100%;
    height:12px;
    position:absolute;
    top:0;
}
.wh_bg_bottom {
    width:100%;
    height:12px;
    background-color:#fff;
    position:absolute;
    bottom:0;
}
.wave {
    width:100%;
    height:25px;
    background-image: url(../images/wave.png);
    background-repeat:repeat-x;
    background-size: auto 100%;
    background-position: center top;
    z-index: 1000;
    position:absolute;
}


.text_wrap {
    width:725px;
    margin:0 auto;
    overflow:hidden;
    text-align:center;
    padding-top:50px;
}
.text_wrap img {
    width:50%;
}
.text_wrap_2 {
    width:725px;
    margin:0 auto;
    overflow:hidden;
    background-color:#77b7d6;
    text-align:center;
    padding-top:50px;
}
.text_wrap_2 img {
    width:50%;
}

.main_wrap_9 {
    width:725px;
    margin:80px auto;
    overflow:hidden;
    text-align:center;
    padding-top:50px;
}
.main_wrap_9 img {
    width:30%;
}




#footer {
	width: 100%;
    height:80px;
    padding-top:5px;
    background-color: #fff;
    text-align: center;
    position: sticky;
  bottom: 0;
    opacity:0.9;
    z-index:3000;
}
.footer_block {
    width:1200px;
    height:50px;
    line-height:50px;
    margin:15px auto;
    overflow:hidden;
}

.footer_logo {
    float:left;
    width:300px;
    text-align:left;
}
.footer_logo img {
    width:90%;
}
.footer_menu {
    width:900px;
    margin-top:12px;
    float:left;
    height:20px;
    line-height:20px;
    color:#000;
}
.footer_menu_1 {
    width:13%;
    font-size:75%;
    font-weight:600;
    float:left;
    border-right:1px solid #000;
}
.footer_menu_2 {
    width:46%;
    font-size:75%;
    font-weight:600;
    float:left;
    border-right:1px solid #000;
}
.footer_menu_3 {
    width:10%;
    font-size:75%;
    font-weight:600;
    float:left;
    border-right:1px solid #000;
}



#navArea {
    display:none;
}
nav {
  display: block;
  position: fixed;
  top: 0;
  right: -300px;
  bottom: 0;
  width: 250px;
  background: #ffffff;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  transition: all .5s;
  z-index: 3;
  opacity: 0;
}
.open nav {
  right: 0;
  opacity: 1;
}
nav .inner {
  padding:60px 30px 0;
}
nav .inner ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
nav .inner ul li {
  position: relative;
  margin: 0;
  border-bottom: 1px solid #333;
}
nav .inner ul li a {
  display: block;
  color: #333;
  font-size: 14px;
  padding: 1em;
  text-decoration: none;
  transition-duration: 0.2s;
}
nav .inner ul li a:hover {
  background: #e4e4e4;
}
