@charset "utf-8";
/*=================================
	reset.css
================================ */
body, div, p, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6,
pre, form, fieldset, input, textarea,p, blockquote{
  margin: 0;
  padding: 0;
}
table {
  border-collapse:collapse;
  border-spacing: 0;
}
img {
  border: 0;
  vertical-align:bottom;
}
address, caption, cite, code, dfn, var {
  font-style: normal;
  font-weight: normal;
}
ul {
  list-style: none;
}
h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal;
}

article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
  display:block;
}

a img {
  border: none;
}

.clear{
  clear:both;
}
.clearfix:before,
.clearfix:after{
  content:"";
  display: table;
}
.clearfix:after{
  clear: both;
}
.clearfix{
  *zoom:1;
}

/*=================================
	general
================================ */
html {
  font-size: 62.5%;
  height: 100%;
}
body {
  font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HiraKakuPro-W3","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS PGothic",Osaka,sans-serif;
  color:#333; 
  font-size: 14px;
  font-size: 1.4rem;
  line-height:1.7;
  background : #FFF;
}

a:link,a:visited { color: #333; text-decoration: underline; }
a:hover { color: #666; text-decoration: underline; }
a {-webkit-tap-highlight-color: #54C3F1;}

/* スマホ縦横 フォントサイズ固定 */
body {
  -webkit-text-size-adjust: 100%;
}

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}

img{
  max-width: 100%;
  height: auto;
  width /***/:auto;　/*IE8のみ適用*/
}

#wrapper {
  width:100%;
  text-align : center;
}

main{
  text-align:left;
  word-break: break-all;
}

/*=================================
	header
================================ */

.header{
  height:149px;
  background: url("../images/headbg.png") 0 0 repeat-x;
}

.header a,
.header a:hover{
  text-decoration:none;
}

.headerinner{
  position:relative;
  width:950px;
  clear:both;
  margin:0 auto;
  text-align:left;
}

.hlogo{
  position:relative;
  width:184px;
  margin-top:10px;
  float:left;
  z-index:3;
}

.hlogo a{
  display:block;
  width:184px;
  height:40px;
  text-indent:100%;
  white-space:nowrap;
  overflow:hidden;
  background-image: url("../images/logo.png");
  background-position: 0 0;
  background-repeat:no-repeat;
}
@media screen and (-webkit-min-device-pixel-ratio:2),
                  (min-resolution: 2dppx){
.hlogo a{
  background-image: url(../images/logo@2x.png);
  -webkit-background-size: 184px 40px;
  background-size: 184px 40px;
}
}


.hmenu{
  float:right;
  z-index: 2;

}


.hsubnavi {
  display: flex;
  justify-content: flex-end;
  gap: 0 5%;
}
.hsubnavi a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  height: 55px;
  white-space: nowrap;
}
.hsubnavi a:before {
  content: "";
  display: inline-block;
  margin-right: 1rem;
}
.h_sns a {
    line-height: 1.2;
    text-align: center;
  background: #FEEEEA;
}
.h_sns a:before {
  width: 18px;
  height: 18px;
  background: url("../images/icon_sns_x.png") no-repeat left center;
  background-size: 100% auto;
}
.h_member a {
  background-color: #FAF5E6;
}
.h_member a:before {
  width: 18px;
  height: 20px;
  background: url("../images/icon_members02.png") no-repeat left center;
  background-size: auto 100%;
}.hmenu a:hover{
  opacity: 0.8;
}
.hnavbox{
  position:relative;
}



/*-------------------- ■ START Media Queries ■ --------------------*/
@media (max-width: 950px) {/*950px以下のスタイル*/
.headerinner{
  width:100%;
}

.hlogo{
  position:relative;
  width:146px;
  margin:14px 0 0 3%;
  float:left;
  z-index:3;
}

.hlogo a{
  display:block;
  width:146px;
  height:32px;
  text-indent:100%;
  white-space:nowrap;
  overflow:hidden;
  background-image: url("../images/logo_sp.png");
  background-position: 0 0;
  background-repeat:no-repeat;
}
@media screen and (-webkit-min-device-pixel-ratio:2),
                  (min-resolution: 2dppx){
.hlogo a{
  background-image: url(../images/logo_sp@2x.png);
  -webkit-background-size: 146px 32px;
  background-size: 146px 32px;
}
}

}/* end 950px */

@media (max-width: 768px) {/*768px以下のスタイル*/
#header{
  height:56px;
}
.hnavbox{
  position:absolute;
  width:100%;
  top:56px;
  padding-bottom:80px;
  display:none;
}

.hmenu{
  width:100%;
  float:none;
  position:absolute;
  bottom:0;
  background-color:rgba(255,255,255,0.9);
}
   
.hsubnavi{
justify-content: flex-start;
    flex-direction: column;
}

   .hsubnavi a{
        padding: 8px 10px 8px 15px;
          height:auto;  
    justify-content: flex-start;

} 
.hsubnavi a:before{
       content: "";
    display: inline-block;
    margin-right: 1.5rem; 
}
    .h_sns a{
        line-height: 1.8;
        background:#FEEEEA;
        border-bottom:1px solid #EBEBEB;
    }  
    .h_sns a br{
        display: none;
    }
.hmenu a:hover{
  text-decoration:underline;
  opacity: 1;
}

}/* end 768px */


/*=================================
	gnav
================================ */
#gnav{
  position:relative;
  z-index:2;
  clear:both;
}
#gnav>ul{
  display:table;
  table-layout: fixed;
  width: 100%;
}

#gnav>ul>li {
  display: table-cell;
  width:16.66%;
  vertical-align: top;
  position: relative;
}
#gnav>ul>li>a {
  display:block;
  height:94px;
  font-size:13px;
  font-size:1.3rem;
  color:#333;
  line-height:1;
  text-align: center;
  padding-top:53px;
  background-position:center 18px;
  background-repeat:no-repeat;
  background-color:#fff;
  border-top:1px #EBEBEB solid;
  border-bottom-width:6px;
  border-bottom-style:solid;
  z-index:30;
}

#gnav>ul>li>a.gnabout{
  background-image: url("../images/icon_about01.png");
  border-bottom-color:#85CFC6;
}
@media screen and (-webkit-min-device-pixel-ratio:2),
                  (min-resolution: 2dppx){
#gnav>ul>li>a.gnabout{
  background-image: url(../images/icon_about01@2x.png);
  -webkit-background-size: 30px 20px;
  background-size: 30px 20px;
}
}

#gnav>ul>li>a.gnkatsudou{
  background-image: url("../images/icon_katsudou01.png");
  border-bottom-color:#F58E7E;
}
@media screen and (-webkit-min-device-pixel-ratio:2),
                  (min-resolution: 2dppx){
#gnav>ul>li>a.gnkatsudou{
  background-image: url(../images/icon_katsudou01@2x.png);
  -webkit-background-size: 30px 20px;
  background-size: 30px 20px;
}
}
#gnav>ul>li>a.gnkensyu{
  background-image: url("../images/icon_kensyukai01.png");
  border-bottom-color:#9DD067;
}
@media screen and (-webkit-min-device-pixel-ratio:2),
                  (min-resolution: 2dppx){
#gnav>ul>li>a.gnkensyu{
  background-image: url(../images/icon_kensyukai01@2x.png);
  -webkit-background-size: 30px 20px;
  background-size: 30px 20px;
}
}
#gnav>ul>li>a.gnbook{
  background-image: url("../images/icon_book01.png");
  border-bottom-color:#DAA8DB;
  padding-top:45px;
  }
@media screen and (-webkit-min-device-pixel-ratio:2),
                  (min-resolution: 2dppx){
#gnav>ul>li>a.gnbook{
  background-image: url(../images/icon_book01@2x.png);
  -webkit-background-size: 30px 20px;
  background-size: 30px 20px;
}
}

#gnav>ul>li>a.gnqa{
  background-image: url("../images/icon_qa01.png");
  border-bottom-color:#FFAD49;
  padding-top:45px;
}
@media screen and (-webkit-min-device-pixel-ratio:2),
                  (min-resolution: 2dppx){
#gnav>ul>li>a.gnqa{
  background-image: url(../images/icon_qa01@2x.png);
  -webkit-background-size: 30px 20px;
  background-size: 30px 20px;
}
}
#gnav>ul>li>a.gnosigoto{
  background-image: url("../images/icon_osigoto01.png");
  border-bottom-color:#78C7F2;
}
@media screen and (-webkit-min-device-pixel-ratio:2),
                  (min-resolution: 2dppx){
#gnav>ul>li>a.gnosigoto{
  background-image: url(../images/icon_osigoto01@2x.png);
  -webkit-background-size: 30px 20px;
  background-size: 30px 20px;
}
}

#gnav>ul>li.navon>a.gnabout {
  background-color:#F3FAF9;
}
#gnav>ul>li.navon>a.gnkatsudou {
  background-color:#FEF3F2;
}
#gnav>ul>li.navon>a.gnkensyu {
  background-color:#F5FAF0;
}
#gnav>ul>li.navon>a.gnqa {
  background-color:#FFF7EC;
}
#gnav>ul>li.navon>a.gnosigoto {
  background-color:#F1F9FE;
}

#gnav>ul>li>a span {
  display:block;
  padding:5px 0;
}

#gnav>ul>li:first-child>a span {
  border-left:none;
}
#gnav>ul>li:nth-child(4) a{
line-height: 1.2;
}
#toggle{
  display:none;
}

/*-------------------- ■ START Media Queries ■ --------------------*/
@media (max-width: 768px) {/*768px以下のスタイル*/

#gnav>ul{
  display:block;
  table-layout: auto;
  border-top:none;
}

#gnav>ul>li {
  display:block;
  width:100%;
  border-bottom:1px #EBEBEB solid;
}
#gnav>ul>li>a,
#gnav>ul>li>a.gnbook,
#gnav>ul>li>a.gnqa{
  display:block;
  height:auto;
  font-size:14px;
  font-size:1.4rem;
  text-align:left;
  padding:10px 10px 10px 50px;
  background-color:rgba(255,255,255,0.9);
  border:none;
  background-position:10px center;
}
#gnav>ul>li.navon>a.gnabout,
#gnav>ul>li.navon>a.gnkatsudou,
#gnav>ul>li.navon>a.gnkensyu,
#gnav>ul>li.navon>a.gnqa,
#gnav>ul>li.navon>a.gnosigoto {
  border-bottom:none;
  background-color:rgba(255,255,255,0.9);
  text-decoration:underline;
}

#gnav>ul>li>a span {
  display:inline;
  padding:0;
  border-left:none;
}

#toggle{
  display:block;
  position:absolute;
  top:16px;
  right:3%;
}

#toggle span{
  display:block;
  width:28px;
  height:22px;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  background-image: url("../images/toggle.png");
  background-position:0 0;
  background-repeat:no-repeat;
}
@media screen and (-webkit-min-device-pixel-ratio:2),
                  (min-resolution: 2dppx){
#toggle span{
  background-image: url(../images/toggle@2x.png);
  -webkit-background-size: 28px 44px;
  background-size: 28px 44px;
}
}

#toggle.gnavon span{
  background-position:0 -22px;
}

}/* end 768px */


/*=================================
	subnav
================================ */
.subnav {
  position:absolute;
  top: 84px;
  width:100%;
  -webkit-transition: all .2s ease;
  transition: all .2s ease;
}

.subnav a{
  display:block;
  font-size:13px;
  line-height:1.5;
  padding:6px 10px;
  background: #fff;
}
.snabout a{
  border-bottom:1px #85CFC6 solid;
}
.snbook a{
  border-bottom:1px #DAA8DB solid;
}
.snqa a{
  border-bottom:1px #FFAD49 solid;
}
.subnav a:hover{
  text-decoration:underline;
}

#gnav>ul>li .subnav {
  visibility: hidden;
  opacity: 0;
  z-index: -1;
}

#gnav>ul>li:hover .subnav {
  top: 94px;
  visibility: visible;
  opacity: 0.9;
}

/*-------------------- ■ START Media Queries ■ --------------------*/
@media (max-width: 950px) {/*950px以下のスタイル*/
.subnav{
}
}/* end 950px */
@media (max-width: 768px) {/*768px以下のスタイル*/
#gnav>ul>li:hover .subnav{
  visibility:hidden;
}
}/* end 768px */


/*=================================
	footer
================================ */

.footer{
  text-align:left;
  margin-top:100px;
  font-size:14px;
  font-size:1.4rem;
}
.footer hr{
  height:6px;
  padding:0;
  margin-top:0;
  border:0 none;
  background: url("../images/cmnline01.png");
}

.footerinner{
  width:950px;
  margin:0 auto;
}

.footerinner nav{
  float:left;
}
.footlink{
    display: flex;
    gap:10px 20px;
}

.footlink a{
  text-decoration:none;
  padding:5px 0 5px 15px;
  background-image: url("../images/arrow01.png");
  background-position:0 center;
  background-repeat:no-repeat;
}
@media screen and (-webkit-min-device-pixel-ratio:2),
                  (min-resolution: 2dppx){
.footlink a{
  background-image: url(../images/arrow01@2x.png);
  -webkit-background-size: 11px 11px;
  background-size: 11px 11px;
}
}

.footlink a:hover{
  text-decoration:underline;
}

.copy{
  font-family:Arial, Helvetica, sans-serif;
  font-size:12px;
  font-size:1.2rem;
  color:#666;
  padding:6px 0;
  float:right;
}

.bread{
  padding:11px 0;
  background:#FAF9F9;
}
.bread a{
  text-decoration:none;
}
.bread a:hover{
  text-decoration:underline;
}
.bread ul{
  padding:0;
}
.bread li{
  display:inline-block;
  font-size:12px;
  font-size:1.2rem;
  color:#666;
  padding-left:15px;
  margin-left:10px;
  background:url("../images/arrow02.png");
  background-position:0 center;
  background-repeat:no-repeat;
}
@media screen and (-webkit-min-device-pixel-ratio:2),
                  (min-resolution: 2dppx){
.bread li{
  background-image: url(../images/arrow02@2x.png);
  -webkit-background-size: 5px 7px;
  background-size: 5px 7px;
}
}
.bread li:first-child{
  padding-left:0;
  margin-left:0;
  background:none;
}

.totop{
  width:950px;
  text-align:right;
  margin:0 auto -6px;
  padding:0;
}
.totop a{
  display:inline-block;
  width:100px;
  height:30px;
  text-indent:100%;
  text-decoration:none;
  white-space:nowrap;
  overflow:hidden;
  background:url("../images/arrow08.png");
  background-position:center center;
  background-repeat:no-repeat;
  background-color:#FAF9F9;
  border-radius:3px 3px 0 0;
  border-bottom:1px #EDEBEA dashed;
}
@media screen and (-webkit-min-device-pixel-ratio:2),
                  (min-resolution: 2dppx){
.totop a{
  background-image: url(../images/arrow08@2x.png);
  -webkit-background-size: 13px 8px;
  background-size: 13px 8px;
}
}
.totop a:hover{
  text-decoration:none;
}
/*-------------------- ■ START Media Queries ■ --------------------*/
@media (max-width: 950px) {/*950px以下のスタイル*/

.footerinner{
  width:100%;
  padding:0 3%;
}
.totop {
  width:96%;
}

}/* end 950px */


@media (max-width: 768px) {/*768px以下のスタイル*/

}/* end 768px */


@media (max-width: 480px) {/*480px以下のスタイル*/
.footer{
  margin-top:50px;
}
.bread{
  display:none;
}
.footerinner nav{
  float:none;
  text-align:center;
}
.copy{
  float:none;
  text-align:center;
}
.footlink{
    padding-top:40px;
    justify-content: center;
}

}/* end 480px */

.mgt30{
    margin-top:30px;
}