@import url(https://fonts.googleapis.com/earlyaccess/notosanssc.css);
.notoSansSC{
    font-family: 'Noto Sans SC', sans-serif;
}
/**
 * Theme Name: Daitou
 * Version: 1.0.0
 * Author: Otatsu
 *
 */
@charset "UTF-8";
/*

base.css

*/

/* ==============================

0:RESET
1:Global Elements Style
2:HEADER Style
3:FOOTER Style

============================== */

/* ---------------------------------------------------------
0:RESET
----------------------------------------------------------*/
html, body, div, section, span, applet, object, iframe, header, footer, nav, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    border: 0;
    margin: 0;
    padding: 0;
}
body {
    line-height: 1;
}
h1, h2, h3, h4, h5, h6 {
    clear: both;
}
ol, ul {
    list-style: none;
}

blockquote {
    quotes: none;
}
blockquote:before, blockquote:after {
    content: '';
    content: none;
}
del {
    text-decoration: line-through;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
    border-collapse: collapse;
    border-spacing: 0;
}
a img {
    border: none;
}
/*scrooll bar for FF*/
html {
    overflow-y: scroll;
}
img {
    max-width: 100%;
}

/*Fonts*/
html {
    font-family: 'Noto Sans SC', sans-serif;
    line-height: 1.9;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust:     100%;
}
body, input, textarea, table {
    color: #000;
    font-family: 'Noto Sans SC', sans-serif;
    font-size: 14px;
    line-height: 1.9;
}
input[type="button"] {
    cursor: pointer;
}

/*Reset: font-size, line-height propaty*/
body {
    /* 12px */
    font-size: 14px;
    line-height: 1.9;
}
h1, h2, h3, h4, h5, h6 {
    /* 16px */
    font-size: 24px;
    line-height: 1.5;
    font-weight:normal;
}
p {
    /* 12px */
    font-size: 14px;
    line-height: 1.9;
}
/* ---------------------------------------------------------
1:Global Elements Style
----------------------------------------------------------*/
/**/
body {
    width: 100%;
    background: #fff;
    color: #000;
}
/**/
div, img {
    background: transparent;
}
img {
    vertical-align: bottom;
}
/**/
input, textarea {
}
/**/
hr {
    clear: both;
    height: 1px;
    border: 0;
    margin: 0 0 15px 0;
    background-color: #ccc;
}
/* Text elements */
strong {
    font-weight: bold;
}
cite, em, i {
    font-style: normal;
}
big {
    font-size: 120%;
}
ins {
    background: #ffc;
    text-decoration: none;
}
blockquote {
    padding: 0 1em;
}
blockquote cite, blockquote em, blockquote i {
    font-style: normal;
}
pre {
    margin: 0 0 18px 0;
    padding: 1.5em;
    line-height: 1.5;
    background: #f7f7f7;
    color: #333;
}
abbr, acronym {
    border-bottom: 1px dotted #666;
    cursor: help;
}
sup, sub {
    position: relative;
    height: 0;
    vertical-align: baseline;
    line-height: 1;
}
sup {
    bottom: 1ex;
}
sub {
    top: .5ex;
}
/*form*/
input[type="text"], input[type="email"], textarea {
    border: 1px solid #ccc;
    padding: 2px;
    background: #fff;
}
input[type="submit"] {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  border-radius: 0;
  border: 1px solid #ccc;
  margin: 0;
  padding: 0;
  background: none transparent;
  vertical-align: middle;
  font-size: inherit;
  color: inherit;
  box-sizing: content-box;
}
/*link*/
a {
    color: #333;
    outline: none;
    text-decoration: none;
}
a:hover {
    text-decoration: none;
}
a:hover,
a img:hover {
    opacity: 0.7;
    filter: alpha(opacity=70);
    -ms-filter: "alpha(opacity=70)";
    -moz-opacity: 0.7;
    -khtml-opacity: 0.7;
}
animation
a, a img {
    -webkit-transition: All 0.5s ease;
    -moz-transition: All 0.5s ease;
    -o-transition: All 0.5s ease;
    -ms-transition: All 0.5s ease;
    transition: All 0.5s ease;
}
/*clearfix*/
.clearfix:after {
  visibility: hidden;
  height: 0;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
}
:focus {
    outline: none;
    box-shadow: none !important;
}

/* utility styles */
.fl { float:left !important;}
.fr { float:right !important;}
.mb10 { margin-bottom:10px !important;}
.mb20 { margin-bottom:20px !important;}
.mt10 { margin-top:10px !important;}
.mt20 { margin-top:20px !important;}
.textR { text-align:right;}
.textC { text-align:center;}
/* ---------------------------------------------------------
2:HEADER Style
----------------------------------------------------------*/
header{
    width:100%;
    border-bottom: 1px solid #dddddd;
}
#header{
    width:1020px;
    margin:0 auto;
    padding:5px 0;
}
header h1{
    margin:0 auto;
    padding-bottom: 20px;
    float: left;
}
header p{
    font-size: 10px;
    padding: 10px 0;
    float: left;
}
header nav{
    text-align:center;
    float: right;
}
header nav li{
    display:inline-block;
    font-size:14px;
    padding:0 0 0 35px;
}
header nav li:first-child {
    padding:0;
}
header nav li a{
    line-height:1;
}

header .sp_caption{
    width: 100%;
}
header .sp_logo{
    width: 70%;
}
header .sp_logo{
    padding-bottom: 15px;
}
/**/
.button-toggle img{
    position: absolute;
    top: 52px;
    right: 15px;
    width: 20px;
}
.menu {
    background: #fff;
}
.menu ul li a {
    padding: 15px 0;
    text-align: center;
    display: block;
    border-top: 1px solid #d7d7d7;
    font-weight: bold;
    font-size: 14px;
}

.fixed{
  position:fixed;
  top:0;
  z-index:9999;
  background:#FFF;
  margin-top:0 !important;
}
/* ---------------------------------------------------------
3:FOOTER Style
----------------------------------------------------------*/
#pagetop{
    position:fixed;
    bottom:10px;
    right:10px;
    z-index:9999;
}

footer {
    background: #333;
    padding: 50px 0;
    text-align: center;
}
footer ul{ padding-bottom: 20px; }
footer ul li{
    display:inline-block;
    padding:0 15px;
}
footer ul li a {
    color: #fff;
}
footer address{
    font-style:normal;
    color: #fff;
}


header nav #side-nav-btn {
    position: absolute;
    top: 20px;
    left: 92%;
}
/*header nav #menu img {
    width: 16px;
}*/


/* ---------------------------------------------------------
4:SIDENAV Style
----------------------------------------------------------*/
#side-nav-btn {
position: fixed;
right: 47px;
top: 47px;
display: block;
width: 26px;
height: 21px;
overflow: hidden;
font-size: 0;
text-indent: -9999px;
cursor: pointer;
-webkit-transition: background 0.3s;
transition: background 0.3s;
z-index: 1000;
}
#side-nav-btn:focus {
outline: none;
}
#side-nav-btn span {
display: block;
position: absolute;
top: 9px;
left: 3px;
right: 3px;
height: 3px;
background: #000;
-webkit-transition: background 0 0.3s;
transition: background 0 0.3s; }
#side-nav-btn span::before,
#side-nav-btn span::after {
position: absolute;
display: block;
left: 0;
width: 100%;
height: 3px;
background-color: #000;
content: "";
-webkit-transition-duration: 0.3s, 0.3s;
transition-duration: 0.3s, 0.3s;
-webkit-transition-delay: 0.3s, 0;
transition-delay: 0.3s, 0; }
#side-nav-btn span::before {
top: -6px;
-webkit-transition-property: top, -webkit-transform;
transition-property: top, transform; }
#side-nav-btn span::after {
bottom: -6px;
-webkit-transition-property: bottom, -webkit-transform;
transition-property: bottom, transform; }
#side-nav-btn.active span {
background: none; }
#side-nav-btn.active span::before,
#side-nav-btn.active span::after {
background-color: #fff;
-webkit-transition-delay: 0, 0.3s;
transition-delay: 0, 0.3s; }
#side-nav-btn.active span::before {
top: 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg); }
#side-nav-btn.active span::after {
bottom: 0;
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg); }
@media screen and (max-width: 720px) {
#side-nav-btn {
  position: fixed;
  right: 18px;
  top: 18px; } }

.area-interior #side-nav-btn.active span::before,
.area-interior #side-nav-btn.active span::after {
  background-color: #000; }

#side-nav {
display: none;
}
#side-nav.visible {
position: fixed;
right: 0;
top: 0;
display: block;
width: 360px;
height: 100%;
box-sizing: border-box;
padding: 120px 0 0 80px;
z-index: 999; }
@media screen and (max-width: 720px) {
#side-nav.visible {
display: block;
width: 100%;
height: 100%;
padding: 40px 0 0 30px; } }
#side-nav.visible #side-nav-main dl {
font-size: 26px;
letter-spacing: 3px;
line-height: 1;
font-weight: 800;
}
@media screen and (max-width: 720px) {
    #side-nav.visible #side-nav-main dl {
      font-size: 18px;
      letter-spacing: 2px;
    }
}
#side-nav.visible #side-nav-main dl dt,
#side-nav.visible #side-nav-main dl dd{
display: list-item;
margin: 20px 0 0 0;
}
@media screen and (max-width: 720px) {
    #side-nav.visible #side-nav-main dl dt
    #side-nav.visible #side-nav-main dl dd{
        margin: 14px 0 0 0;
    }
}
#side-nav.visible #side-nav-main dl dt:first-child,
#side-nav.visible #side-nav-main dl dd:first-child {
  margin: 0;
}
#side-nav.visible #side-nav-main dl dt a,
#side-nav.visible #side-nav-main dl dd a{
  color: #fff;
}
#side-nav.visible #side-nav-pages {
    margin: 48px 0 0 0;
    margin: 0;
    text-align: left;
}
@media screen and (max-width: 720px) {
    #side-nav.visible #side-nav-pages {
      margin: 24px 0 0 0;
      margin: 0;
    }
}
#side-nav.visible #side-nav-pages dl {
    font-size: 16px;
    letter-spacing: 3px;
    line-height: 1;
}
@media screen and (max-width: 720px) {
    #side-nav.visible #side-nav-pages dl {
    font-size: 16px;
    letter-spacing: 1px;
    }
}
#side-nav.visible #side-nav-pages dl dt,
#side-nav.visible #side-nav-pages dl dd{
display: list-item;
list-style: none;
margin: 25px 0 0 0;
padding: 0;
}
#side-nav.visible #side-nav-pages dl dt{
    font-weight: bold;
}
#side-nav.visible #side-nav-pages dl dd{
padding-left: 25px;
list-style: none;
position: relative;
}
#side-nav.visible #side-nav-pages dl dd:before{
}

@media screen and (max-width: 720px) {
    #side-nav.visible #side-nav-pages dl dt,
    #side-nav.visible #side-nav-pages dl dd{
      margin: 20px 0 0 0;
    }
}
#side-nav.visible #side-nav-pages dl dt:first-child,
#side-nav.visible #side-nav-pages dl dt:first-child{
    margin: 0;
}
#side-nav.visible #side-nav-pages dl dt a,
#side-nav.visible #side-nav-pages dl dd a{
    color: #fff;
}

#side-nav.visible #side-nav-social {
    margin: 48px 0 0 0;
}

#side-nav {
    background-color: #273457;
    /*filter:alpha(opacity=90)!important;
    -moz-opacity: 0.9!important;
    opacity: 0.9!important*/;
}

#side-title {
position: fixed;
left: 50px;
top: 50%;
display: block;
width: 11px;
height: auto;
overflow: visible;
z-index: 10;
margin-top: 80px; }
@media screen and (max-width: 720px) {
#side-title {
  display: none;
}
}
#side-title p {
font-size: 11px;
font-weight: 700;
letter-spacing: 1px;
transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-webkit-transform: rotate(-90deg);
}

#side-title p a {
color: #000;
white-space: nowrap;
word-break: nowrap;
}