@charset "utf-8";
/* reset */
* { padding: 0; margin: 0; box-sizing: border-box; }
table { border-collapse: collapse; border-spacing: 0; }
fieldset, img { border: 0; }
address, caption, cite, code, dfn, em, var { font-style: normal; font-weight: normal; }
ol, ul { list-style: none; }
caption, th { text-align: left; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
q:before, q:after { content: ''; }
abbr, acronym { border: 0; }
section, article { display: block; }
.col img {
    max-width: 50px !important;
    height: auto;
}
address {
    display: none !important;
}
/* base */
html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { word-wrap : break-word; overflow-wrap : break-word; font-kerning: normal; -webkit-font-kerning: normal; font-size: 16px; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; text-align: center; letter-spacing: 0.03em; margin: 0px; box-sizing: border-box; background-color: #FFF; color: #333; padding: 0em; line-height: 2.2em; }
img { vertical-align: bottom; height: auto; width: 100%; }
::selection { background: #333333; color: #FFF; }
::-moz-selection { background: #333333; }
/* link */
a:link, a:visited, a:active { color: #333333; text-decoration: none; }
a:hover { color: #333333; text-decoration: none; opacity: 0.8; filter: alpha(opacity=80); -ms-filter: "alpha(opacity=80)"; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; }
a:hover img { opacity: 0.8; filter: alpha(opacity=80); -ms-filter: "alpha(opacity=80)"; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; }
/* clear */
.clear { clear: both; }
.cbox { zoom: 100%; }
.cbox:after { content: " "; clear: both; height: 0; display: block; visibility: hidden; }
/* options */
.r { border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; }
.rl { -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; }
.button { text-align: center !important; border: 1px solid #000; width: 100%; padding-top: 0.4em; padding-bottom: 0.4em; }
.button:hover { cursor: pointer; color: #FFF; background-color: #333; padding-top: 0.4em; padding-bottom: 0.4em; border: 1px solid #000; }
.fa { margin-right: 0.5em; }
.pcbr { display: block; }
.spbr { display: none; }
.fade { overflow:hidden; }
.caption { font-size:0.8em !important; line-height:2em !important; }
/* map */
iframe{ width: 100%; height: 500px; }

/* wrapper */
#wrapper { min-width: 1000px; max-width: 1550px; position: relative; width: 100%; margin-right: auto; margin-left: auto; }
.btn_wrapper.clearfix { display: none; }

/* header */
#header { width: 88%; margin-right: auto; margin-left: auto; margin-top: 3.5em; }
#header h1 { float: left; min-width: 13%; max-width:16%; }
#header ul { float: right; letter-spacing:0.06em; text-align: left; line-height: 1em; }
#header ul .none { margin-left:0; }
#header ul li { display: inline-block; margin-left: 2em; vertical-align:top; }

/* contents */
#contents { width: 93%; margin-right: auto; margin-left: auto; margin-top: 4.5em; margin-bottom: 6em; text-align: left; }

/* footer */
#footer { margin-top: 5em; margin-bottom: 6em; font-size: 1em; }
#footer #sns { margin-bottom: 1em; }
#footer #sns li { font-size: 1.5em; display: inline-block; vertical-align:top; margin-left: 0.4em; }
#footer #sns li:nth-child(2) { margin-right: 0; }
#footer footer { margin-top: 3em; font-size: 0.8em; }

/* Clearfix
=================================*/
.clearfix:after { content: " "; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }
/* Hide from Mac IE \*/

.clearfix { display: block; }
* html .clearfix { height: 1%; }
/* Hide from Mac IE */

/* Centering */
.ver_center { position: relative; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); }
.hor_center { position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
.center { position: relative; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.sp_menu { position: fixed; width: 100%; height: 100%; top: 0; left: 0; background-color: transparent; z-index: 9; display: none; }
.menu_overlay { position: fixed; width: 100%; height: 100%; top: 0; left: 0; background-color: #FFFFFF; opacity: 0.95; z-index: -1; }
.menu_btn { width: 60px; height: 65px; position: fixed; overflow: visible; line-height: 13px; font-size: 1px; float: left; cursor: pointer; -webkit-transition: all 400ms ease-out 0ms; -moz-transition: all 400ms ease-out 0ms; -o-transition: all 400ms ease-out 0ms; transition: all 400ms ease-out 0ms; top: 0px; right: 0px; z-index: 999; }
.menu_btn .line { position: fixed; background-color: #000000; overflow: hidden; z-index: 999; width: 31px; height: 1px; -webkit-transition: all 400ms ease-out 0ms; -moz-transition: all 400ms ease-out 0ms; -o-transition: all 400ms ease-out 0ms; transition: all 400ms ease-out 0ms; top: 30px; right: 15px; }
.menu_btn .line:nth-child(1) { top: 30px; z-index: 2; }
.menu_btn .line:nth-child(2) { top: 40px; z-index: 2; }
.menu_btn .line:nth-child(3) { top: 50px; z-index: 2; }
.btn_wrapper .menu { color: #333333; font-family: bebas; font-size: 0.6em; padding-top: 1em; text-align: center; display: block; clear: both; width: 31px; margin-left: 15px; position: fixed; left: 0px; top: 0px; }
.btn_wrapper { z-index: 999; position: fixed; }
/*
メニューオープン時のクリックボタン
*/
.btn_wrapper.clicked .menu_btn .line:nth-child(1) { -webkit-transform: translateY(10px) rotate(45deg); transform: translateY(10px) rotate(45deg); -webkit-transition: all 400ms ease-out 0ms; -moz-transition: all 400ms ease-out 0ms; -o-transition: all 400ms ease-out 0ms; transition: all 400ms ease-out 0ms; }
.btn_wrapper.clicked .menu_btn .line:nth-child(2) { opacity: 0; -webkit-transition: all 400ms ease-out 0ms; -moz-transition: all 400ms ease-out 0ms; -o-transition: all 400ms ease-out 0ms; transition: all 400ms ease-out 0ms; }
.btn_wrapper.clicked .menu_btn .line:nth-child(3) { -webkit-transform: translateY(-10px) rotate(-45deg); transform: translateY(-10px) rotate(-45deg); -webkit-transition: all 400ms ease-out 0ms; -moz-transition: all 400ms ease-out 0ms; -o-transition: all 400ms ease-out 0ms; transition: all 400ms ease-out 0ms; }
nav.sp_menu ul { position: relative; display: inline-block; margin-top: 15vh; margin-right: auto; margin-bottom: 0; margin-left: auto; width: 100%; }
nav.sp_menu ul li { font-size: 1.4em; line-height: 2.5em; font-weight: normal; text-align: center; margin-bottom: 1em; letter-spacing: 0.05em; display: block; float: none; clear: both; margin-right: auto; margin-left: auto; }
.sp_menu ul .sns { vertical-align:middle; position: relative; display: inline-block; margin-right: 0.35em; margin-bottom: 0; margin-left: 0.35em; width: 6%; }
.sp_menu ul .sns:nth-child(8) { width: 18%; }
section.logo.center img { width: 100%; height: auto; }
span.horizontal { content: ""; height: 2px; width: 6px; background-color: #fff; display: block; margin: 20px 0; }
section.logo.center { max-width: 450px; width: 80%; max-height: 69px; height: auto; position: absolute; }
small { font-size: 9px; margin-top: 35px; display: block; text-transform: uppercase; }


/* media screen */

@media screen and (min-width: 0px) and (max-width: 1000px) {
body { font-size: 14px; }
}
@media screen and (min-width: 1001px) and (max-width: 1350px) {
body { font-size: 14px; }
}
@media screen and (min-width: 1351px) and (max-width: 1450px) {
body { font-size: 15px; }
}
@media screen and (min-width: 1451px) and (max-width: 1550px) {
body { font-size: 16px; }
}

@media screen and (max-width: 470px) {
body { font-size: 13px; }
.pcbr { display: none; }
.spbr { display: block; }
iframe{ width: 100%; height: 450px; }

/* wrapper */
#wrapper { min-width: 0px; width: 100%; padding-top: 2em; padding-bottom: 2em;  }
.btn_wrapper.clearfix { display: block; }


/* header */
#header { width: 88%; margin-right: auto; margin-left: auto; margin-top: 3.5em; }
#header h1 { float: none; display: block; min-width: 37.5%; width:37.5%;  max-width: 37.5%; margin-right:auto; margin-left:auto;  }
#header ul { display:none; }
#header .sub_navi { display:none; }

/* contents */
#contents { width: 90%; margin-right: auto; margin-left: auto; margin-top: 6.5em; margin-bottom: 6em; text-align: left; }

/* footer */
#footer { margin-top: 5em; margin-bottom: 4em; font-size: 1em; }

  nav.sp_menu ul { position: relative; display: inline-block; margin-top: 22vh; margin-right: auto; margin-bottom: 0; margin-left: auto; width: 100%; }
nav.sp_menu ul li { font-size: 1.4em; line-height: 2.5em; font-weight: normal; text-align: center; margin-bottom: 1em; letter-spacing: 0.05em; display: block; float: none; clear: both; margin-right: auto; margin-left: auto; }
.sp_menu ul .sns { vertical-align:middle; position: relative; display: inline-block; margin-right: 0.35em; margin-bottom: 0; margin-left: 0.35em; width: 6%; }
.sp_menu ul .sns:nth-child(8) { width: 18%; }
  
}
