@charset "utf-8";
/* ======================================================


    import


========================================================*/
@import url(/asset/css/module.css);
@import url(/asset/css/module-sp.css);

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


    reset


========================================================*/
* { box-sizing:border-box; padding:0; margin:0; }
*::before,
*::after { box-sizing:border-box; }

h1,h2,h3,h4,h5,h6 { font-weight:normal; line-height:1em; }

ul{ list-style:none; }
img{ vertical-align:bottom; }
strong,em { font-weight:normal; }


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


    common


========================================================*/
body {
	font-family:
      "ヒラギノ角ゴ ProN W3",
      Hiragino Kaku Gothic ProN, 
      Arial, 
      "メイリオ", 
      Meiryo, 
    sans-serif;
    font-size:.9em;
    font-weight:500;
    line-height:1.8em;
    color:#333;
}

a { color:#2499AC; text-decoration:none; transition:.2s; }
a:hover { text-decoration:underline; opacity:.7; }

.articleWrap { padding:60px 0 80px; }

/* 
 *    color 
 */
  /* blue */
.clrBgBlu { background-color:#465c79; }
.clrBdrBlu { border-color:#465c79; }
 /* green */
.clrBgGrn { background-color:#077a27; }
.clrBdrGrn { border-color:#077a27; }
 /* light green */
.clrBgLitGrn { background-color:#92bc10; }
.clrBdrLitGrn { border-color:#92bc10; }
 /* red */
.clrBgRed { background-color:#b72e22; }
.clrBdrRed { border-color:#b72e22; }
 /* purple */
.clrBgPpl { background-color:#494679; }
.clrBdrPpl { border-color:#494679; }
/* black 100% */
.clrBgRichBlk { background-color:#000; }
.clrBdrRichBlk { border-color:#000; }
.clrRichBlk { color:#000; }
/* black 90%  */
.clrBgBlk { background-color:#333; }
.clrBdrBlk { border-color:#333; }
.clrBlk { color:#333; }
/* white */
.clrBgWht { background-color:#FFF; }
.clrBdrWht { border-color:#FFF; }
.clrWht { color:#FFF; }

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


    js


========================================================*/
/*
 *  toup
 */
#toup { position:fixed; right:10px; bottom:20px; z-index:9900; width:45px; height:45px; background-color:#000; cursor:pointer; }
#toup > .inner { position:relative; width:100%; height:100%; }
#toup > .inner::before { display:block; content:""; position:absolute; top:50%; right:50%; width:0; height:0; border-right:6px solid transparent; border-bottom:10px solid #FFF; border-left:6px solid transparent; transform:translate(50%,-50%); }

/*
 *  modal [age]
 */
.confirmAge.modaal-wrapper { background-color:#FFF; }
.confirmAge .modaal-container { box-shadow:none; }
.confirmAge .confirmAgeInr { text-align:center; }
.confirmAge .confirmAgeInr .welcome { margin:35px auto 0; font-size:200%; font-weight:bold; }
.confirmAge .confirmAgeInr .detail { padding:30px; }
.confirmAge .confirmAgeInr .detail .q { font-size:145%; font-weight:bold; color:#ca3e73; }
.confirmAge .confirmAgeInr .detail .info { margin:20px auto; }
.confirmAge .confirmAgeInr .detail .btnlist li { display:inline-block; }
.confirmAge .confirmAgeInr .detail .btnlist li + li { margin-left:10px; }
.confirmAge .confirmAgeInr .detail .btnlist li .button a { display:block; padding:10px 30px; border-radius:3px; font-weight:bold; background-color:#777; color:#FFF; }
.confirmAge .confirmAgeInr .detail .btnlist li .button.enter a { background-color:#ca3e73; }
.confirmAge .confirmAgeInr .detail .btnlist li .button a:hover { text-decoration:none; }

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


    global navigation


========================================================*/
#globalNavi { padding-top:10px; }
#globalNavi .list > li { font-size:1.1em; line-height:1.4em; color:#4f2512; }
#globalNavi .list > li + li { margin-top:25px; }
#globalNavi .list > li a { display:block; position:relative; padding-left:15px; text-decoration:none; color:#4f2512; }
#globalNavi .list > li a::before { display:inline-block; content:""; position:absolute; top:3px; left:-10px; width:16px; height:16px; margin-right:7px; vertical-align:middle; background:url(../img/ico-navi.png) no-repeat center; background-size:cover; }
#globalNavi .list > li a::after  { display:inline-block; content:""; position:absolute; top:3px; left:-10px; width:16px; height:16px; margin-right:7px; vertical-align:middle; background:url(../img/ico-navi-active.png) no-repeat center; background-size:cover; opacity:0; }
#globalNavi .list > li a:hover { color:#8a7830; }
#globalNavi .list > li a:hover::after { opacity:1; }

.subNavWrap { display:none; position:absolute; top:114px; right:0; left:0; padding:15px 0 7px; border-bottom:solid 1px #ccc; background-color:#FFF; z-index:9999; }
.subNavWrap ul { overflow:hidden; }
.subNavWrap ul li { position:relative; overflow:hidden; float:left; width:32%; height:90px; margin-bottom:1%; }
.subNavWrap ul li a { display:block; }
.subNavWrap ul li a::after { display:block; content:""; position:absolute; top:0; left:0; width:100%; height:100%; border:solid 2px transparent; transition:.2s; cursor:pointer; }
.subNavWrap ul li a:hover::after { border-color:#61caea; }
.subNavWrap ul li img { width:100%; }
.subNavWrap ul li + li { margin-left:2%; }
.subNavWrap ul li:nth-child(4n) { margin-left:auto; }

#globalNavBtn { display:none; }



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


    header


========================================================*/
#header { border-bottom:solid 1px #ccc; }
#header > .inner { padding:20px 0; }

#header #logoCircle { width:220px; margin:0 auto; }
#header #logoCircle img { width:100%; }

#header #globalNav { margin-top:25px; }
#header #globalNav li a { font-weight:bold; color:#333; }
#header #globalNav li a:hover { opacity:1; }
#header #globalNav > ul { overflow:hidden; }
#header #globalNav > ul > li { float:left; }
#header #globalNav > ul > li + li { margin-left:25px; }

/*
 *    sp global navigation hidden
 */
#glbNaviBtn { display:none; }
#glbRespNav { display:none; }


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


    side


========================================================*/
#side #archive .compoTitle { font-size:115%; }
#side #archive .list ul li + li { padding-top:15px; border-top:dotted 1px #ccc; margin-top:15px; }
#side #archive .list ul li img { width:100%; }
#side #archive .list ul li a { display:block; color:#333; }
#side #archive .list ul li dl { overflow:hidden; }
#side #archive .list ul li dl dt { overflow:hidden; float:left; width:80px; max-height:60px; }
#side #archive .list ul li dl dd { margin-left:90px; font-size:85%; line-height:1.4em; }
#side #archive .list ul li dl dd .title { margin-bottom:5px; font-weight:bold; }
#side #archive .list ul li dl dd .date { color:#777; }

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


    contents


========================================================*/
#contents { padding:60px 0 100px; }


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


    top page


========================================================*/
#areaTop .topContTtl { display:inline-block; padding:10px; border-radius:3px; line-height:1em; font-size:125%; background-color:#449cb1; color:#FFF; }

#areaTop #newest .visual { width:650px; }
#areaTop #newest .visual img { width:100%; }
/* swiper parts */
#areaTop #newest .newest-thumbs { width:300px; }
#areaTop #newest .newest-thumbs li { float:none; overflow:hidden; height:auto !important; margin-bottom:8px; cursor: pointer; }
#areaTop #newest .newest-thumbs img { width:100%; }
#areaTop #newest .newest-thumbs .swiper-slide-thumb-active img { border:solid 2px #61caea; }

#areaTop #news { margin-top:60px; }
#areaTop #news .newsLine { margin-top:20px; }
#areaTop #news .newsLine > ul > li + li { padding-top:10px; border-top:dotted 1px #ccc; margin-top:10px; }
#areaTop #news .newsLine > ul > li > dl { overflow:hidden; }
#areaTop #news .newsLine > ul > li > dl dt { float:left; width:8em; }
#areaTop #news .newsLine > ul > li > dl dd { margin-left:8em; }

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


    blog page


========================================================*/
#blog {}
#blogDtl .titleWrap { position:relative; padding-bottom:10px; border-bottom:solid 2px #000; margin-bottom:40px; }
#blogDtl .titleWrap::after { content:""; position:absolute; right:0; bottom:-2px; left:0; width:80px; border-bottom:solid 2px #92bc10; }
#blogDtl .titleWrap .title { font-size:165%; font-weight:bold; }
#blogDtl .titleWrap .date { margin-top:5px; font-size:85%; color:#777; }

/* blog modules */
#blogContents .readTtl { padding-left:5px; border-left:solid 14px #92bc10; margin-bottom:15px; font-size:115%; font-weight:bold; line-height:1.4em; }
#blogContents .fontBold { font-weight:bold; }
#blogContents br { display:block; }
#blogContents br.break { display:inline; }
#blogContents .paragraph + .paragraph { margin-top:20px; }
#blogContents .imgBox { width:600px; }
#blogContents .imgBoxVrt { width:350px; }
#blogContents .imgBox img,
#blogContents .imgBoxVrt img { width:100%; }
#blogContents .imgBox.imgSmall { max-width:300px; }
#blogContents .imgCap { margin-top:5px; font-size:85%; line-height:1.6em; color:#777; }

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


    paging


========================================================*/
/* wpのデフォルト版 */
.paging { padding:5px 0; margin:80px auto 0; text-align:center; }
.paging .pages { display:none; }
.paging .wp-pagenavi { display:inline-block; }
.paging .wp-pagenavi span,
.paging .wp-pagenavi a { padding:7px 10px; margin:0 2px 2px; border-radius:2px; line-height:1em; border:solid 1px #077a27; color:#077a27; }
.paging .wp-pagenavi .current { background-color:#077a27; color:#FFF; }

/* カスタマイズ版 */
.paging.typeNum {  }
.paging.typeNum li { display:inline-block; }
.paging.typeNum li span,
.paging.typeNum li a { display: block; padding:7px 10px; margin:0 2px 2px; border-radius:2px; line-height:1em; border:solid 1px #077a27; color:#077a27; }
.paging.typeNum li .current { background-color:#077a27; color:#FFF; }

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


    footer


========================================================*/
#footer { text-align:center; border-top:solid 1px #ccc; }
#footer > .inner { padding:60px 0 60px; }
#footer a { color:#FFF; }
#footer .txtCopyright { font-size:65%; color:#777; }