/*
Theme Name: 2018 Mid
Author: Author
Author URI: URI
Version: 1.0
*/

@import url(//fonts.googleapis.com/earlyaccess/notosansjp.css);
/*
  font-family: 'Noto Sans JP';
  font-weight: 100,300,400,500,700,900;
*/
@import url(//cdn.jsdelivr.net/npm/yakuhanjp@3.0.0/dist/css/yakuhanjp.min.css);
/*
  font-family: YakuHanJP;
*/
@import url(//fonts.googleapis.com/earlyaccess/sawarabimincho.css);
/*
  font-family: 'Sawarabi Mincho';
*/

/* ===========================================================
   # BASE
=========================================================== */
* {
    border: none;
    font: inherit;
    outline: none;
    vertical-align: bottom;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
    }

html       {font-size: 10px;}
html, body {width: 100%; height: 100%;}
body       {
    background: #f5f5f5 url(./img/bg.jpg) 0/1200px;
    color: #111;
    font: 400 1.4rem/1 YakuHanJP,'Noto Sans JP',sans-serif;
    font-feature-settings : "palt" 1;
    letter-spacing: 0.5px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    }


strong {font-weight: 700}
img    {max-width: 100%; height: auto}
ol,ul  {list-style:none}
table  {border-collapse: collapse;}


/* CLASS */
.inner {
    width: 94%;
    max-width: 1160px;
    }

.align_c {text-align: center}
.align_l {text-align: left}
.align_r {text-align: right}

.auto   {margin: auto}
.clear  {clear: both}
.hidden {overflow: hidden}
.serif  {
    font-family: "Sawarabi Mincho", serif;
    font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif;
    }

.posRe {position: relative}
.posAb {position: absolute}

.noSP, .onPC {display: none}

.boxradiusAll {border-radius: 10px;}
.boxradiusTop {border-top-left-radius: 5px; border-top-right-radius: 5px;}
.boxShadow    {box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.4);}
.txtShadow    {text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.8);}

/* FLEX */
.flex {
    display: flex;
    flex-wrap: wrap;
    }
.flex li:before {
    display: none;
    }


/* = @media width 768px -->
----------------------------------------------------------- */
@media (min-width: 768px) {

.alignleft  {float: left}
.alignright {float: right}

.onSP     {display: none!important}
.noSP     {display: block}
span.noSP {display: inline}

}


/* = @media width 980px -->
----------------------------------------------------------- */
@media (min-width: 980px) {

.onPC {display: block}
.noPC {display: none!important}

}


/* ===========================================================
   # HREF
=========================================================== */
a {
    color: #333;
    outline: none;
    text-decoration: none;
    }
a:hover {}

/* IMG */
a:hover img {
    filter: alpha(opacity=90);
    -moz-opacity:0.9;
    opacity:0.9;
    }


/* ===========================================================
   # LAYOUT
=========================================================== */
.wrap {}


/* = HEAD
----------------------------------------------------------- */
.head {}

.btnMenu {
    right: 0; top: 20px;
    width: 40px; height: 40px;
    }


/* = CONTENT
----------------------------------------------------------- */
.main {}


/* = SIDE
----------------------------------------------------------- */
.side {}


/* = FOOT
----------------------------------------------------------- */
.foot {}
.copy {}

.gotoTop {
    background: #6266ae url(./img/arrow_top.png) 50% 6px/28px no-repeat;
    color: #fff;
    font-size: .84rem;
    font-weight: 700;
    padding: 23px 0 0;
    width: 40px; height: 40px;
    position: fixed;
    right: 5px; bottom: 77px;
    z-index: 999;
    }


/* = @media width 768px -->
----------------------------------------------------------- */
@media (min-width: 768px) {


}


/* ===========================================================
   # NAVI
=========================================================== */
body.open {position: fixed}
.layer {
    background: rgba(20,20,40,0.9) url(./img/sp_close.png) 50%/40px no-repeat;
    cursor: pointer;
    display: none;
    position: fixed;
    bottom: 0; left: 0;
    width: 100vw; height: 25%;
    z-index: 66666;
    }

#spNav {
    background: #FB7724;
    overflow: auto;
    position: fixed;
    top: 0; right: -525px;
    width: 525px; height: 100%;
    z-index: 99999;
    -webkit-overflow-scrolling: touch;
    }
#spNavIn {
    min-height: 100%;
    overflow: auto;
    position: relative;
    }


/* = G NAVI
----------------------------------------------------------- */
.gNav {
    display: none;
    z-index: 99999;
    }

.gNav li {}

.gNav li a {
    background-position: 0 0;
    background-size: 100%;
    display: block;
    width: 100px; height: 60px;
    }
.gNav li a:hover,
.gNav li.current-menu-item a, .gNav li.current-menu-parent a,
.gNav li.current-category-ancestor a, .gNav li.current-page-ancestor a {
    background-position: 0px -60px;
    }

.gNav li.menu-item-1 a {background-image: url(./img/gnav_about.png);}


/* = @media width 768px -->
----------------------------------------------------------- */
@media (min-width: 768px) {

.layer {display: none!important}

#spNav {
    background: transparent;
    position: static;
    }

/* G NAVI */
.gNav {display: block !important;}

}


/* ===========================================================
   # HOME
=========================================================== */

/* = NEWS
----------------------------------------------------------- */
.homeNews_list li {
    padding: 15px 0;
    width: 100%;
    }
.homeNews_list span {
    display: block;
    }


/* = @media width 980px -->
----------------------------------------------------------- */
@media (min-width: 980px) {

/* NEWS */
.homeNews_list li {
    text-overflow: ellipsis;
    white-space: nowrap;
    }
.homeNews_list span {padding-right: 1em;}

}





