a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,button,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,html,i,iframe,img,input,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video {
  border: 0;
  margin: 0;
  padding: 0;
  vertical-align: baseline
}

html {
  font-size: 62.5%;
  line-height: 1
}

button,h1,h2,h3,h4,h5,h6,input,textarea {
  font-weight: 400
}

article,aside,details,figcaption,figure,footer,header,menu,nav,section {
  display: block
}
* {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
body {
  position: relative;
  -webkit-font-smoothing: antialiased;
  color: #555;
  font-family: Arial,Lucida Grande,Hiragino Kaku Gothic ProN,ヒラギノ角ゴ ProN W3,Meiryo,メイリオ,sans-serif;
  -webkit-font-feature-settings: "palt";
  font-feature-settings: "palt";
  font-size: 1.6rem;
  font-size: 16px;
  line-height: 1.7;
  letter-spacing: .05em;
}

::-moz-selection {
  background: #f0ede6
}

::selection {
  background: #f0ede6
}

img {
  vertical-align: bottom;
  max-width: 100%
}

a {
  color: #2054a2;
  text-decoration: none
}

a:hover {
  color: #183e77
}

em {
  font-style: normal
}

ol,ul {
  list-style: none
}

blockquote,q {
  quotes: none
}

blockquote:after,blockquote:before,q:after,q:before {
  content: none
}

table {
  border-collapse: collapse;
  border-spacing: 0
}
.hide {
  display: none
}

.cf {
  clear: both
}

.cf:after {
  clear: both;
  content: "";
  display: block;
  height: 0
}
@media screen and (min-width: 1025px){
.tab,.sp{display:none;}
.pc { display: block}

}
@media screen and (min-width: 415px) and (max-width: 1024px){
.pc,.sp{display:none;}
.tab { display: block}
}
@media screen and (max-width: 414px){ 
.pc,.tab{display:none;}
.sp { display: block}
}

.footer__nav {
  background: #252a5e;
  padding: 34px 0
}

.footer__nav__body {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0 auto;
  width: 90%;
  max-width: 1200px
  }

.footer__nav__body li {
  border-right: 1px solid hsla(0,0%,80%,.2);
  color: #cab98f;
  display: inline-block;
  font-size: 14px;
  margin-right: 24px;
  padding-right: 24px;
  vertical-align: middle
}

.footer__nav__body li:last-child {
  border: 0
}

.footer__nav__body li a {
  color: inherit
}

.footer__ctgList {
  background: #252a5e;
  border-top: 1px solid #1b1f4c;
  padding: 34px 0 19px
}

.footer__ctgList__body {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0 auto;
  width: 1200px
}

.footer__ctgList__body li {
  border-right: 1px solid hsla(0,0%,80%,.2);
  color: #999;
  display: inline-block;
  font-size: 12px;
  margin: 0 24px 15px 0;
  padding-right: 24px;
  vertical-align: middle
}

.footer__ctgList__body li:last-child {
  border: 0
}

.footer__ctgList__body li a {
  color: inherit
}

.footer__bottom,.registerFooter__bottom {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 20px auto;
  width: 90%;
  max-width: 1200px
}

.footer__help {
  float: left
}

.footer__help li {
  border-right: 1px solid hsla(0,0%,80%,.2);
  color: #999;
  display: inline-block;
  font-size: 12px;
  margin: 0 12px 0 0;
  padding-right: 14px;
  vertical-align: middle
}

.footer__help li:last-child {
  border: 0;
  margin-right: 0
}

.footer__help li a {
  color: #333
}

.footer__groupServiceWrap {
  background: #f8f8f8;
  padding: 20px 0
}

.footer__groupService {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0 auto;
  width: 1200px
}

.footer__groupService li {
  border-right: 1px solid hsla(0,0%,80%,.2);
  color: #999;
  display: inline-block;
  font-size: 12px;
  margin: 0 24px 0 0;
  padding-right: 24px;
  vertical-align: middle
}

.footer__groupService li:last-child {
  border: 0
}

.footer__groupService li a {
  color: inherit
}

.footer__copyright {
  color: #999;
  float: right;
  font-size: 12px;
  margin-top: 4px
}

.footer__service {
  background: #f8f8f8;
  color: #999;
  font-size: 12px;
  padding: 0;
}

.footer__service__body {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0 auto;
  width: 90%;
  max-width: 1200px
}

.footer__service__body a {
  color: inherit
}

.footer__service__contents {
  display: inline-block;
  vertical-align: middle
}

.footer__service__copyright {
  background-color: #f8f8f8;
  color: #999;
  float: right;
  font-size: 10px;
  text-align: center
}
@media screen and (max-width: 768px) {
  .footer__service {
    margin-bottom: 96px
  }
  .footer__help {
      background: #f3f3f3;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      letter-spacing: -.4em
  }

  .footer__help li {
      -ms-flex-preferred-size: 50%;
      display: inline-block;
      flex-basis: 100%;
      padding: 1em;
      font-size: 14px;
      letter-spacing: normal;
      line-height: 1.2;
      text-align: left
  }

  .footer__help--lib li a {
      color: #666;
      display: block;
      padding: 24px 16px
  }
  .footer__bottom, .registerFooter__bottom {
    margin:0;
    width:100%;
  }
  .footer__service__body {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0 auto;
    width: 100%;
    max-width: 1200px;
  }
  .footer__service__contents {
    display: block;
    vertical-align: middle;
    text-align: center;
    padding: 1em 0;
  }
  .footer__service__copyright {
    background-color: #ffffff;
    color: #999;
    float: none;
    font-size: 10px;
    text-align: center;
    padding: 30px 0;
  }
}

@media print {
  .header {
      height: 80px;
      margin-bottom: 40px;
      padding: 0
  }

.header:before {
    content: url(../img/logo.svg);
    display: block;
    margin: -10px -130px;
    position: absolute;
    right: 50%;
    top: 50%;
    width: 260px
  }

 .breadcrumb,.entryFixBar,.footer,.header__nav,.header__wrap,.separateContainer,.shareBtnsBar {
      display: none
  }
}

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: #fff;
  background-color: rgba(0,0,0,0);
  border: 1px solid #ccc;
  border-radius: 3px;
  -webkit-box-shadow: inset 0 -1px 0 0 #eee;
  box-shadow: inset 0 -1px 0 0 #eee;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #333;
  cursor: pointer;
  display: inline-block;
  font-size: 14px;
  height: 41px;
  padding: 0 50px 0 10px;
  -webkit-transition: all .3s;
  -o-transition: all .3s;
  transition: all .3s;
  vertical-align: middle
}

select:hover {
  -webkit-box-shadow: inset 0 -1px 0 0 #eee,1px 1px 1px 0 hsla(0,0%,87%,.7);
  box-shadow: inset 0 -1px 0 0 #eee,1px 1px 1px 0 hsla(0,0%,87%,.7)
}

select::-ms-expand {
  display: none
}

.form__selectWrap,.form__selectWrap--inline {
  background-color: #fff;
  border-radius: 3px;
  position: relative;
  z-index: 0
}

.form__selectWrap--inline:before,.form__selectWrap:before {
  border: 4px solid rgba(0,0,0,0);
  border-top: 5px solid #252a5e;
  bottom: 0;
  content: "";
  display: block;
  height: 0;
  margin: auto 0;
  position: absolute;
  right: 15px;
  top: 0;
  width: 0;
  z-index: -1
}

.form__selectWrap--inline:after,.form__selectWrap:after {
  border-left: 1px solid #eee;
  content: "";
  display: block;
  height: calc(100% - 2px);
  position: absolute;
  right: 40px;
  top: 1px;
  width: 0;
  z-index: -1
}

.form__selectWrap--inline {
  display: inline-block;
  min-height: 41px;
  vertical-align: middle
}

.form__select {
  display: block;
  width: 100%
}

input[type=email],input[type=password],input[type=search],input[type=text] {
  -webkit-appearance: textfield;
  border: 1px solid #ccc;
  border-radius: 3px;
  -webkit-box-shadow: inset 1px 1px 3px 0 #eee;
  box-shadow: inset 1px 1px 3px 0 #eee;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 14px;
  height: 41px;
  line-height: 1.4;
  padding: 10px;
  -webkit-transition: all .3s;
  -o-transition: all .3s;
  transition: all .3s
}

input[type=email]:hover,input[type=password]:hover,input[type=search]:hover,input[type=text]:hover {
  -webkit-box-shadow: inset 1px 1px 3px 0 #ddd;
  box-shadow: inset 1px 1px 3px 0 #ddd
}

input[type=email]:focus,input[type=password]:focus,input[type=search]:focus,input[type=text]:focus {
  -webkit-box-shadow: inset 1px 1px 3px 0 #ddd;
  box-shadow: inset 1px 1px 3px 0 #ddd;
  outline: 0
}

input[type=submit] {
  -webkit-appearance: none
}

.form__inputField {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: block;
  width: 100%
}


svg[class*=accountMeritIcon] {
  display: inline-block;
  overflow: hidden
}

svg[class*=accountMeritIcon] g,svg[class*=accountMeritIcon] path {
  fill: #252a5e
}

/* 全体レイアウト */
@media screen and (min-width: 1260px) {
  .libAbout__container {
    position: relative;
    display: flex;
    margin: 0 auto;
    align-content: flex-start;
    align-items: flex-start;
    background: #fff; 
  }

  .libAbout__container--main {
    position: relative;
    width: calc(100% - 340px);
  }
}
@media screen and (max-width: 1259px) {
  .libAbout__container {
    width:100%;
    overflow: hidden
  }

  .libAbout__container--main {

  }
}
/* menu */
.libAboutHeaderNavi__content {
 background:#252a5e;
}
.libAboutHeaderNavi__inner {
  align-items: center;
  justify-content: end;
  box-sizing: border-box;
  display: flex;
  width: 95%;
  margin: 0 auto;
  padding:.4em 0;
}
.libAboutHeaderNavi__item {
  margin-left: 1em;
  line-height: 1 
}
.libAboutHeaderNavi__item__link {
  color:#fff;
  font-size:13px;
}
.libAboutHeaderNavi__item__link:hover {
  color:#eee;
}
.libAboutHeaderNavi__item + .libAboutHeaderNavi__item {
  border-left: 1px solid #fff;
  padding-left: 1em;
}
@media screen and (max-width: 1259px) {
 .libAboutHeaderNavi__content {
  display:none;
 }
}
.libAboutHeader__btn {
  -webkit-font-feature-settings: "palt";
  font-feature-settings: "palt";
  -webkit-font-feature-settings: normal;
  font-feature-settings: normal;
  border-radius: 3px;
  cursor: pointer;
  display: block;
  font-size: 16px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .1em;
  letter-spacing: 0;
  padding: 8px 24px;
  text-align: center
}

.libAboutHeader__btn[data-theme=primary] {
  background: #252a5e;
  border: none;
  -webkit-box-shadow: inset 0 -1px 0 0 #000;
  box-shadow: inset 0 -1px 0 0 #000;
  color: #fff;
  -webkit-transition: all .3s;
  -o-transition: all .3s;
  transition: all .3s
}

.libAboutHeader__btn[data-theme=primary]:hover {
  background: #2f3578;
  -webkit-box-shadow: inset 0 -1px 0 0 #000,1px 1px 1px 0 #ddd;
  box-shadow: inset 0 -1px 0 0 #000,1px 1px 1px 0 #ddd;
  -webkit-box-shadow: none;
  box-shadow: none
}

.libAboutHeader__btn[data-theme=gold] {
  background: #b39b5f;
  color: #fff;
  -webkit-transition: all .3s;
  -o-transition: all .3s;
  transition: all .3s
}

.libAboutHeader__btn[data-theme=gold]:hover {
  background: #beaa77
}

.libAboutHeader__btn[data-theme=default] {
  background: #fff;
  border: 1px solid #252a5e;
  -webkit-box-shadow: inset 0 -1px 0 0 #eee;
  box-shadow: inset 0 -1px 0 0 #eee;
  color: #333;
  color: #252a5e;
  -webkit-transition: all .3s;
  -o-transition: all .3s;
  transition: all .3s
}

.libAboutHeader__btn[data-theme=default]:hover {
  border: 1px solid #4b54b8;
  -webkit-box-shadow: inset 0 -1px 0 0 #eee,1px 1px 1px 0 hsla(0,0%,87%,.7);
  box-shadow: inset 0 -1px 0 0 #eee,1px 1px 1px 0 hsla(0,0%,87%,.7);
  color: #4b54b8
}
@media screen and (max-width: 767px) {
  .libAboutHeader__btn[data-theme=default] {
    padding: 6px 14px;
    font-size: 12px;
    white-space: nowrap;
  }
}
.libAboutHeaderMenu__inner {
  background-color: #f8f8f8;
  border-top: 1px solid #ddd;
  -webkit-box-sizing: border-box;
  box-sizing: border-box
}

.libAboutHeaderMenu__list {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  justify-content: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0 auto;
  padding:8px 0;
 font-size:14px;
}

.libAboutHeaderMenu__list__item+.libAboutHeaderMenu__list__item {
  margin-left: 48px
}

.libAboutHeaderMenu__list__item a{
  color: #666
}

.libAboutHeaderMenu__list__item a:hover {
  cursor: pointer;
  text-decoration: underline
}

.libAboutHeaderMenu__list__item a:visited {
  color: #666
}
@media screen and (min-width: 1259px) {
  .libAboutHeaderMenu {
    display: none
  }
}
@media screen and (max-width: 1259px) {
  .libAboutHeader__nav { 
    display: none
  }
  .libAboutHeader .libAboutHeader__inner{
    height: auto;
    padding: 0.8em 0;
  }
  .libAboutHeaderMenu {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
  }
 .libAboutHeaderMenu input[type=checkbox] { 
    display: none
  }
  .libAboutHeaderMenu,.libAboutHeaderMenu__button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
  }

  .libAboutHeaderMenu__button {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: center;
    position: fixed;
    right: 5px;
    top: 0;
    width: 9vw;
    height: 9vw;
    z-index: 90
  }
  .libAboutHeaderMenu__button span,.libAboutHeaderMenu__button span:after,.libAboutHeaderMenu__button span:before {
    background-color: #666;
    content: "";
    display: block;
    height: 1px;
    position: absolute;
    width: 20px
  }

  .libAboutHeaderMenu__button span:before {
    bottom: 4px
  }

  .libAboutHeaderMenu__button span:after {
    top: 4px
  }

  #libAboutHeaderMenu__button-check:checked~.libAboutHeaderMenu__button {
    border: none
  }

  #libAboutHeaderMenu__button-check:checked~.libAboutHeaderMenu__button span {
    background-color: hsla(0,0%,40%,0)
  }

  #libAboutHeaderMenu__button-check:checked~.libAboutHeaderMenu__button span:before {
    bottom: 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
  }

  #libAboutHeaderMenu__button-check:checked~.libAboutHeaderMenu__button span:after {
    top: 0;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg)
  }

  #libAboutHeaderMenu__button-check:checked~.libAboutHeaderMenu__content {
    left: 0
  }
  .libAboutHeaderMenu__list__item+.libAboutHeaderMenu__list__item {
    margin-left: 0;
  }
  .libAboutHeaderMenu__content {
    background-color: #fff;
    height: 100%;
    left: 100%;
    position: fixed;
    top: 0;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    width: 100%;
    z-index: 80
  }

  .libAboutHeaderMenu__inner {
    margin-left: auto;
    margin-right: auto;
    max-width: 480px;
    padding: 80px 40px 0;
    background:#fff;
  }
  
  .libAboutHeaderMenu__list {
    flex-wrap: wrap;
    border-bottom: 1px solid #ccc;
    margin-bottom: 24px;
    padding: 0;
  }
  .libAboutHeaderMenu__list__item {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    font-size: 16px;
    padding: 9px 15px 10px 0;
    position: relative;
    text-align: left;
    text-decoration: none;
    width: 100%
  }
  .libAboutHeaderMenu a.libAboutHeader__btn {
    width: 100%;
    margin: 20px 0 0;
  }
  .libAboutHeaderMenu__list__item a{
    display: block;
    width: 100%;
    padding: 0.5em 0;
  }
  .libAboutHeaderMenu__nav__item__link {
    max-width: 400px;
    border-radius: 3px;
    cursor: pointer;
    display: block;
    font-weight: 700;
    letter-spacing: .1em;
    padding: 16px 24px;
    text-align: center
  }

  .libAboutHeaderMenu__nav__item__link[data-theme=default] ,
  .libAboutHeaderMenu__nav__item__link[data-theme=default] {
    background: #fff;
    border: 1px solid #252a5e;
    -webkit-box-shadow: inset 0 -1px 0 0 #eee;
    box-shadow: inset 0 -1px 0 0 #eee;
    color: #333;
    color: #252a5e
  }

  .libAboutHeaderMenu__nav__item__link[data-theme=primary] {
    background: #252a5e;
    border: 1px solid #252a5e;
    -webkit-box-shadow: inset 0 -1px 0 0 #000;
    box-shadow: inset 0 -1px 0 0 #000;
    color: #fff;
  }

  .libAboutHeaderMenu__nav__item__link[data-theme=gold] {
    background: #b39b5f;
    border: 1px solid #99854d;
    color: #fff
  }
 .libAboutHeaderMenu__nav__item__link[data-theme=login] {
    background: #efefef;
    border: 1px solid #efefef;
    color: #252a5e
  }
  .libAboutHeaderMenu__nav__item+.libAboutHeaderMenu__nav__item {
    margin-top: 20px;
  }
}
/* header */
.libAboutHeader {
  background-color: #fff;
  border-bottom: 1px solid #ddd;
  width: 100%;
}

.libAboutHeader__inner {
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  align-items: center;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 64px;
  justify-content: space-between;
  margin: 0 auto;
  width: 90%;
  max-width: 1200px
}

.libAboutHeader__servicelogo {
  -ms-flex-preferred-size: 240px;
  background: url(../img/logo_lib.svg) 0 no-repeat;
  background-size: contain;
  display: block;
  flex-basis: 220px;
  height: 30px;
  overflow: hidden;
  text-indent: -999em;
  -webkit-transform: all .2s;
  -ms-transform: all .2s;
  transform: all .2s
}

.libAboutHeader__servicelogo__link {
  display: block
}
@media screen and (min-width: 1260px) {
  .libAboutHero__sp ,
  .libAboutIntro-sp {
    display: none
  }
}
@media screen and (max-width: 1259px) {
  .lp .libAboutHeader ,
  .libAboutHero,
  .libAboutIntro-pc {
    display:none
  }
  .libAboutIntro-sp {
    display: block
  }
}

/*FORM*/
.libAboutHero__form__heading {
  position: relative;
  font-size: 14px;
  font-weight: 600;
  text-align: center;
  color: #25295e;
}

.libAboutHero__form__heading span {
  position: relative;
  display: inline-block;
}

.libAboutHero__form__heading span:before,
.libAboutHero__form__heading span:after {
  position: absolute;
  top: 0;
  content: "";
  width: 1px;
  height: 100%;
  background: #000;
  border-radius: 3px;
}
 
.libAboutHero__form__heading span:before {
  left: -.3em;
  transform: rotate(-35deg);
}
 
.libAboutHero__form__heading span:after {
  right: -.3em;
  transform: rotate(35deg);
}

.libAbout__form--note {
  margin-top: 8px;
  font-size:12px;
}

@media screen and (min-width: 1260px) {
  .libAbout__form {
    position: fixed;
    top: 0;
    right: 0;
    width: 26.66667%;
    width: 342px;
    min-height: 100vh;
    background: #e5e5e5;
    border:4px solid #e5e5e5;
    padding: 0 8px 0 10px;
    box-sizing: border-box;
    z-index: 3
  }
  
  .libAbout__form__inner {
    overflow: auto;
    display: flex;
    align-items: center;
    height: 99vh;
    padding: 0 8px;
  }
  .libAbout__form__inner--main {
    
  }
  .libAbout__form.form--active {
    background: #fff;
    border:4px solid #ffad43;
  }
}

@media screen and (max-width: 1259px) {
  .libAbout__form {
    padding: 0 0 40px;
    background: #f8f8f8;
  }
  .libAbout__form__inner {
    width: 90%;
    margin: 0 auto;
  }
  .libAboutHero__form__heading {
    font-size: 17px;
  }
}

/* HERO */
@media screen and (min-width: 1260px) {
  .libAboutHero {
    background-image: url(../img/hero__bgImage.jpg);
    background-repeat: no-repeat;
    background-size: 100% auto;
    margin-top: 0;
    overflow: hidden;
    position: relative
  }
  .libAbout__form__heading {
    color: #666;
    font-size: 16px;
    text-align: center;
    line-height: 1.5
  }

  .libAboutHero:after {
    background: #f8f8f8;
    background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(248,248,248,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(248,248,248,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(248,248,248,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#f8f8f8',GradientType=0 ); 
    bottom: 0;
    content: "";
    height: 200px;
    left: 0;
    position: absolute;
    width: 100%
  }

  .libAboutHero__inner {
    display:flex;
    align-content: center;
    justify-content: center;
    margin: 0 auto;
    padding: 7vw 0 4vw;
    position: relative;
    width:100%;
    z-index: 1
  }

  .libAboutHero__item {
    width: 34em;
    padding: 20px;
    background: #fff;
    box-shadow: 0 0 14px -6px rgba(0,0,0,.8);
    text-align: center;
  }

  .libAboutHeroRibbon {
    position: relative;
    display: inline-block;
    margin-left: -238px;
    margin-bottom: 1em;
    padding: 0.4em 1em;
    background: #252a5e;
    border: 1px solid #fff;
    color: #fff;
  }

  .libAboutHeroRibbon::after {
    content: "";
    position: absolute;
    top:0;
    right:-1.5em;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 2.4em 1.5em 0 0;
    border-color: #252a5e transparent transparent transparent;
  }

  .libAboutHero__text {
    color: #252a5e;
    font-size: 32px;
    letter-spacing: .1em;
    font-weight: 600
  }

  .libAboutHero__text--main {
    color: #937f4e;
    font-size: 56px;
  }
}


/*common*/
.libAbout__content--oblique ,
.libAbout__content--oblique--white ,.libAbout__content--oblique2 ,
.libAbout__content--oblique--white2 {
  position:relative;
}

.libAbout__content--oblique::before ,
.libAbout__content--oblique--white::before,
.libAbout__content--oblique2::before ,
.libAbout__content--oblique--white2::before {
  background: #fafafa;
  bottom: -16px;
  content: "";
  height: 200px;
  left: -10%;
  position: absolute;
  -webkit-transform: rotate(4deg);
  -ms-transform: rotate(4deg);
  transform: rotate(4deg);
  -webkit-transform-origin: left center;
  -ms-transform-origin: left center;
  transform-origin: left center;
  width: 120%;
  z-index: 0
}

.libAbout__content--oblique2::before ,
.libAbout__content--oblique--white2::before {
  -webkit-transform-origin: right center;
  -ms-transform-origin: right center;
  transform-origin: rightcenter;
  -webkit-transform: rotate(-4deg);
  -ms-transform: rotate(-4deg);
  transform: rotate(-4deg);
}

.libAbout__content--oblique--white2::before ,
.libAbout__content--oblique--white::before {
  background: #fff;
}
.libAbout__content--bgWhite {
  background:#fff;
}
.libAbout__content--bgGray {
  background:#fafafa;
}

.libAbout__inner {
  position: relative;
  margin: 0 auto;
  padding:20px 0 40px;
  width: 95%;
  max-width: 1200px;
  z-index: 1;
}

.libAbout__heading {
  position: relative;
  margin-bottom: 2em;
  text-align: center;
  color:#252a5e;
  font-size:30px;
  font-weight:600
}

.libAbout__heading--gold {
  color: #b39b5f;
  font-size: 150%;
}

.libAbout__heading::after {
  content:"";
  position: absolute;
  bottom:-.5em;
  left:50%;
  margin-left: -3em;
  width:6em;
  height:4px;
  background-color:#e1e1e1;
  border-radius:10px
}

.libAboutText {
  text-align: center;
  color: #555;
  line-height: 2
}

@media screen and (max-width: 414px) {
  .libAbout__heading {
    font-size: 21px;
  }
}

.libAboutIntro {
  background-color: #f8f8f8 ;
  background-image: url("../img/intro__bgImage.jpg");
  background-repeat: no-repeat;
  background-position:bottom right -10%;
  background-size:1200px auto;
  padding: 2vw 0 40px;
  position: relative
}

.libAboutIntro__heading {
  font-size: 1.8vw;
  font-weight: 600;
  line-height: 1.8;
  color: #252a5e;
  letter-spacing: .05em
}

.libAboutIntro__heading--gold {
  color: #b39b5f;
}

.libAboutIntro__heading__note {
  width: 50%;
  margin-top: 1em;
  font-size:12px;
}

.libAboutIntro ul {
  display: flex;
}

.libAboutIntro ul li {
  padding: 0px 24px 16px 0
}

.libAboutIntro__image { 
  width:120px;
}
@media screen and (min-width: 1259px) and (max-width: 1500px) {
  .libAboutIntro {
    background-position: bottom left 60%;
    background-size: 130% auto;
    padding: 40px 0 130px;
  }
}
@media screen and (max-width: 960px) {
  .libAboutIntro {
    background-position: bottom right 60%;
    background-size: 120% auto;
    padding: 40px 0 130px;
  }
  .libAboutIntro__heading {
    font-size: 3.8vw;
  }
  .libAboutIntro__image {
    width: 90px;
  }
}
@media screen and (max-width: 414px){
  .libAboutIntro {
    background-position: bottom right 0;
    background-size: 180% auto;
    padding: 0 0 200px;
  }
  .libAboutIntro ul {
    justify-content: center;
  }
  .libAboutIntro ul li {
    padding: 0px 24px 16px;
  }
  .libAboutIntro__heading {
    font-size: 20px;
    text-align: center;
  }
  .libAboutIntro__heading__note {
    width: 100%;
    font-size: 10px;
    line-height: 1.5;
    text-align: center
  }
}

/*banner*/
.libAboutBanner {
  position: relative;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 10px auto 0px;
  padding: 24px 0 24px;
  background:#ddd; 
}
.libAboutBanner__inner {
  width: 95%;
  max-width: 1200px;
  margin: 0 auto;
  z-index: 1
}
.libAboutBanner ul {
 width:100%;
 display:flex;
 justify-content: center
}
.libAboutBanner ul li {
 width:44%;
 padding:0 20px;
}
.libAboutBanner p {
 width:83%;
 margin: 16px auto 0
}
.slick-arrow {
 text-indent: -99999px;
 cursor: pointer
}

.libAboutBanner .slick-arrow:before{
 content:""!important;
 width: 1.5%!important;
 height: 100%!important;
 position: absolute;
 top: 0;
 cursor: pointer;
 z-index: 2;
 cursor: pointer 
}

.libAboutBanner .slick-next:before{
  content: "";
  background: url("../img/arrow__right--white.png") no-repeat center!important;
  background-size: auto 15% !important;
  right:-2%;
}

.libAboutBanner .slick-prev:before{
  background: url(../img/arrow__left--white.png) no-repeat center!important;
  background-size: auto 15% !important;
  left: -2%;
}
.libAboutBanner .libAboutBanner--note {
 font-size:11px;
}
@media screen and (max-width: 767px) {
 .libAboutBanner {
   padding: 16px 0 16px;
 }
 .libAboutBanner ul {
  flex-wrap: wrap
 }
 .libAboutBanner ul li {
  width:90%;
  padding:16px 8px 0;
 }
 .libAboutBanner p {
  width: 93%;
  margin: 16px auto 0;
  line-height: 1.2;
  font-size: 12px;
 }
}

.libAboutProblem {
  position: relative;
  background: #e7e7e7 url("../img/problem__bgImage.png") no-repeat top center;
  background-size:100% auto;
  padding: 80px 0 40px;
}

.libAboutProblem::after {
  content: "";
  position: absolute;
  bottom: -100px;
  left: 50%;
  right: 0;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 100px 50vw 0 50vw;
  border-color: #e7e7e7 transparent transparent transparent;
  transform: translateX(-50%);
  z-index: 2
}

.libAboutProblem .libAbout__heading::after {
  background-color:#fff;
}

.libAboutProblem ul {
  display: flex;
  justify-content: space-between;
  margin: 80px auto 0
}

.libAboutProblem ul li {
  width:30%;
  padding: 56px 0 0;
  background:#f3f3f3;
  border:2px solid #fff;
  text-align: center;
  font-size:18px;
}

.libAboutProblem__image { 
  width:100%;
}
@media screen and (max-width: 414px) {
  .libAboutProblem {
    padding: 64px 0 0;
  }
  .libAboutProblem ul {
    flex-wrap: wrap;
    margin: 40px auto 0
  }
  .libAboutProblem ul li {
    width:80%;
    margin:0 auto 24px;
    padding-top: 32px
  }
}

/* libAboutSupport */
.libAboutSupport {
  background: rgb(245,245,245); 
  background: -moz-linear-gradient(top, rgba(245,245,245,1) 30%, rgba(255,255,255,1) 100%); 
  background: -webkit-linear-gradient(top, rgba(245,245,245,1) 30%,rgba(255,255,255,1) 100%); 
  background: linear-gradient(to bottom, rgba(245,245,245,1) 30%,rgba(255,255,255,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#ffffff',GradientType=0 );
  padding:160px 0 240px;
}

.libAboutSupport .libAbout__heading::after {
  background-color:#fff;
}

.libAboutSupport ul {
  display: flex;
  justify-content: space-between;
  margin: 80px auto 0
}

.libAboutSupport ul li {
  position: relative;
  width:30%;
  padding: 0;
}

.libAboutSupport__item {
  width:90%;
  padding:32px 20px;
  background:#fff;
  box-shadow: 0 0 16px -4px rgba(0,0,0,.3);
  border-radius:4px;
  text-align: center;
  line-height: 1.8
}

.libAboutSupport__title {
  margin-bottom: 1em;
  font-weight: 600;
  font-size:18px;
  color: #252a5e;
}

.libAboutSupport__image { 
  width:90%;
  margin: 0
}

.libAboutSupport__text { 
  font-size:14px
}
@media screen and (min-width: 961px) {
  .libAboutSupport__item {
    position: absolute;
    bottom:-9em;
    right: 0;
    width:90%;
    padding:32px 16px;
    background:#fff;
    box-shadow: 0 0 16px -4px rgba(0,0,0,.3);
    border-radius:4px;
    text-align: center;
    line-height: 1.8
  }
}
@media screen and (max-width: 960px) {
  .libAboutSupport {
    padding:160px 0 40px;
  }
  .libAboutSupport ul {
    flex-wrap: wrap
  }
  .libAboutSupport ul li {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
    margin: 0 auto 40px;
    padding: 0;
  }
  .libAboutSupport__item {
    width: 60%;
    padding: 32px 20px;
    margin-left: -8%;
  }
  .libAboutSupport__item ul li:nth-of-type(2n) {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-flow: row-reverse;
    flex-flow: row-reverse
  }
  .libAboutSupport__image {
    width: 50%;
    margin: 0;
  }
}
@media screen and (max-width: 414px) {
  .libAboutSupport ul {
    margin-top: 0
  }
  .libAboutSupport ul li {
    display: block;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
    margin: 40px auto 0;
    padding: 0;
  }
  .libAboutSupport__image {
    width: 90%;
    margin: 0;
    position: relative;
  }
  .libAboutSupport__item {
    width: 95%;
    padding: 32px 20px;
    margin: -80px auto 0;
    position: relative;
  }
}
/* libAboutFeature */
.libAboutFeaturePoint,.libAboutFeaturePoint__item {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between
}

.libAboutFeature__number {
  font-size: 60px;
  font-weight: 500;
  color:#e2e2e2;
}
span.libAboutFeature__number {
  padding-right: .5em
}

.libAboutFeaturePoint__item {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  padding: 40px;
  text-align: center;
  width: calc(50% - 20px)
}

.libAboutFeaturePoint__title {
  color: #252a5e;
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 16px
}

.libAboutFeaturePoint__text {
  font-size: 16px;
  letter-spacing: .1em;
  text-align: left
}

.libAboutFeaturePoint__image {
  height: auto;
  margin-left: auto;
  margin-right: auto;
  margin-top: 40px;
  max-width: 400px
}
@media screen and (max-width: 1024px) {
  .libAboutFeaturePoint {
    display:flex;
    flex-wrap: wrap;
    margin-bottom: 50px;
  }
  .libAboutFeaturePoint__item {
    width:100%;
    max-width: 480px;
    margin: 0 auto;
    margin-top: 0;
    padding: 40px 24px;
  }
  .libAboutFeaturePoint__image {
    height: 124px;
    margin-top: 24px;
    width: auto;
  }
}
@media screen and (max-width: 414px) {
  .libAboutFeature__number {
    font-size: 52px;
  }
  span.libAboutFeature__number {
      padding-right: 0.2em;
  }
}
.libAboutFeature__heading {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 1em;
  font-size: 26px;
  font-weight: 600;
  text-align: center;
}
@media screen and (max-width: 768px) {
.libAboutFeature__heading {
    font-size: 20px;
    margin-bottom: 40px;
  }
}
.libAboutFeatureList,.libAboutFeatureList__item {
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between
}

.libAboutFeatureList__item {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  background: #fff;
  border: 1px solid #ddd;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -ms-flex-direction: column;
  flex-direction: column;
  margin-top: 64px;
  padding: 40px 0 0;
  text-align: center;
  width: calc(33.3333% - 10px)
}

.libAboutFeatureList__title {
  color: #252a5e;
  font-size: 20px;
  font-weight: 700;
  padding: 0 20px;
}

.libAboutFeatureList__text {
  font-size: 16px;
  letter-spacing: .1em;
  text-align: left;
  padding: 16px 32px
}

.libAboutFeatureList__text--strong {
  border-bottom: 1px solid #b39b5f;
  font-weight: 700;
}

.libAboutFeatureList__text--small {
  font-size: 12px;
  font-weight: 400
}

.libAboutFeatureList__image {
  height: auto;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1024px) {
  .libAboutFeatureList {
    display:flex;
    flex-wrap: wrap;
    margin-bottom: 50px;
  }
  .libAboutFeatureList__item {
    width:100%;
    max-width: 480px;
    margin: 0 auto;
    margin-top: 40px;
    padding: 40px 0 0;
  }
}

.libAboutFeatureSeminar {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-content: space-between;
  margin: 40px auto 40px
}

.libAboutFeatureSeminar li {
  width:33.333%;
  padding:10px;
}

.libAboutFeatureSeminar__accordion__button {display:none;}

@media screen and (max-width: 768px) {
  .libAboutFeature03 {
    margin-top: -40px
  }
  .libAboutFeatureSeminar li {
    width:50%;
  }
}
@media screen and (max-width: 414px) {
  .libAboutFeatureSeminar li {
    width:80%;
  }
}

@media screen and (min-width: 769px) {
  .libAboutFeature__item {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 40px auto 0
  }

  .libAboutFeature__item:nth-of-type(2n) {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-flow: row-reverse;
    flex-flow: row-reverse
  }
}
.libAboutFeature__image {
  width: 40%
}

.libAboutFeature__textArea {
  width: 50%;
  line-height: 2
}

.libAboutFeature__title {
  margin-bottom: .8em;
  font-size: 26px;
  color:#252a5e;
}
@media screen and (max-width: 768px) {
  .libAboutFeature02 {
    padding-bottom: 56px;
  }
  
  .libAboutFeature__item {
    margin: 24px auto 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap
  }

  .libAboutFeature__textArea {
    width: 80%;
    margin: 40px auto 0;
  }
  
  .libAboutFeature__image {
    width: 60%;
    margin: 0 auto
  }
}
@media screen and (max-width: 414px) {
  .libAboutFeature__textArea {
    width: 95%;
    margin: 24px auto 0;
  }
  .libAboutFeature__title {
    font-size: 22px;
  }
  .libAboutFeatureSeminar {
    margin: 24px auto
  } .libAboutFeatureSeminar__accordion__inner { display:none;}
  
 .libAboutFeatureSeminar__accordion__button {
    display: block;
    margin-bottom: 40px;
    text-align: center
  }

  .libAboutFeatureSeminar__accordion__button p {
    display:inline-block;
    padding:4px 16px;
    border:1px solid #555;
    cursor:pointer;
    text-align: center;
    font-size:14px;
  }
  .libAboutFeatureSeminar__accordion__button .accordion__button--close { 
    display:none;
  }
  .libAboutFeatureSeminar__accordion__button.accordion--open .accordion__button--open { 
    display:none;
  }
  
  .libAboutFeatureSeminar__accordion__button.accordion--open .accordion__button--close {
    display:inline-block;
  }
}


/*libAboutFeatureCourse*/
.libAboutFeatureCourse {
  background-color: #f9f8f5;
  color: #666;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 16px auto 40px;
  padding: 40px 40px;
  width:100%;
}

.libAboutFeatureCourse__item {
  width: 30%
}

.libAboutFeatureCourse__item+.libAboutFeatureCourse__item {
  margin-left: 40px
}

.libAboutFeatureCourse__title {
  font-weight: 700;
  margin-bottom: 12px
}

.libAboutFeaturePublisher__sort {
  font-size: 12px;
  font-weight: 400;
  margin-left: 8px
}

.libAboutFeatureCourse__text {
  font-size: 12px
}

@media screen and (min-width: 768px) and (max-width: 1024px){
  .libAboutFeatureCourse__item {
    width: 85%;
  }
}
@media screen and (max-width: 1024px) {
  .libAboutFeatureCourse {
    padding: 24px;
    text-align: left;
    flex-wrap: wrap
  }
  .libAboutFeatureCourse__item {
    width: 100%;
  }
   .libAboutFeatureCourse__item+.libAboutFeatureCourse__item {
    margin-left: 0;
    margin-top: 16px
  }

  .libAboutFeatureCourse__title {
    font-weight: 700;
    margin-bottom: 4px
  }

  .libAboutFeatureCourse__item+.libAboutFeatureCourse__item {
      margin-top: 16px
  }

  .libAboutFeatureCourse__title {
    font-weight: 700;
    margin-bottom: 4px
  }
}


.libAboutFeature04 {
  position: relative
}

.libAboutFeature04::before {
  background: #fff;
  bottom: 0;
  content: "";
  height: 130px;
  left: 0;
  position: absolute;
  width: 100%;
}
@media screen and (min-width: 1025px) {
  .libAboutFunction__item {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 40px auto 80px;
  }
}
@media screen and (max-width: 767px) {
  .libAboutFunction__item {
    margin: 40px auto ;
  }
  .libAboutFunction__textArea {
    margin-top: 24px;
  }
}

.libAboutFunction__textArea {
  width: 50%
}
.libAboutFunction__video {
    width: 45%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    z-index: 1;
}
.libAboutFunction__title {
  color: #252a5e;
  font-size: 28px
}

.libAboutFunction__title:after {
  border-bottom: 1px solid #b39b5f;
  content: "";
  display: block;
  margin: 24px 0;
  width: 80px
}

@media screen and (max-width: 1024px) {
  .libAboutFunction__inner {
    max-width: 480px;
  }

  .libAboutFunction__video {
    margin: 20px auto 40px;
    width: 100%;
  }
  .libAboutFunction__title {
    color: #252a5e;
    font-size: 20px;
    text-align: center;
  }
  .libAboutFunction__title:after {
    margin: 24px auto;
  }

  .libAboutFunction__item {
    margin: 40px auto 0;
  }
  .libAboutFunction__video ,
  .libAboutFunction__textArea {
    width: 100%;
    margin: 24px auto 0;
  }
}

.libAboutFunctionList {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 64px auto 0
}

.libAboutFunctionList,.libAboutFunctionList__item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: space-between;
}

.libAboutFunctionList__item {
  position: relative;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -ms-flex-direction: column;
  flex-direction: column;
  justify-content: space-between;
  text-align: center;
  width: 32%;
  padding: 56px 24px 24px;
  background: #fff
}

.libAboutFunctionList__title {
  color: #252a5e;
  font-weight: 700;
  margin-bottom: 1em
}

.libAboutFunctionList__text {
  margin-bottom: 1em;
  text-align: left
}

.libAboutFunctionList__text--small {
  font-size:14px;
}

.libAboutFunctionList__image {
  position: absolute;
  top:-28px;
  left:50%;
  margin-left:-28px;
  width:56px;
  height: auto;
}

@media screen and (max-width: 768px) {
  .libAboutFunction{
    padding: 80px 16px;
  }
  .libAboutFunction__inner {
    width: 100%;
  }

  .libAboutFunction__heading {
    margin-bottom: 16px;
    font-size: 20px;
  }
  .libAboutFunctionList__item+.libAboutFunctionList__item {
    margin-top: 40px;
  }
}
@media screen and (max-width: 1024px){
  .libAboutFunction{
    padding: 24px 16px;
  }
  .libAboutFunctionList__item {
    width:100%;
    max-width: 480px;
    margin: 0 auto;
  }
  
  .libAboutFunctionList__item+.libAboutFunctionList__item {
    margin-top: 40px;
  }
  
  .libAboutFunction__heading {
    margin-bottom: 16px;
    font-size: 20px;
  }
}

.libAboutScenes {
  background-color: #f8f8f8;
  padding-bottom: 120px;
  position: relative
}

.libAboutScenes__inner {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0 auto;
  position: relative;
  width: 90%;
  max-width: 1200px

}

.libAboutScenes__heading {
  color: #666;
  font-size: 24px;
  margin-bottom: 120px;
  text-align: center
}

.libAboutScenes__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex
}

.libAboutScenes__list__item {
  background-color: #fff;
  height: 260px;
  position: relative;
  text-align: center;
  width: 380px
}

.libAboutScenes__list__item+.libAboutScenes__list__item {
  margin-left: 30px
}

.libAboutScenes__list__image {
  height: 120px;
  left: 130px;
  position: absolute;
  top: -60px
}

.libAboutScenes__list__title {
  color: #252a5e;
  font-size: 18px;
  font-weight: 700;
  margin-top: 90px
}

.libAboutScenes__list__text {
  margin-top: 8px
}


.libAboutCustomer {
  padding: 0 0 80px
}

.libAboutCustomer__inner {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0 auto;
  width: 100%;
  max-width: 1200px
}

.libAboutCustomer
.libAbout__heading {
  color: #555;
}

.libAboutCustomer
.libAbout__heading::after {
  background-color: #b39b5f;
}

.libAboutCustomer__heading--gold {
  color: #b39b5f;
  font-size: 150%;
}

.libAboutCustomer__heading--gold small {
  font-size: 70%;
}

.libAboutCustomer__heading--note {
  font-size: 14px;
  margin-top: 16px;
  text-align: center
}

.libAboutCustomerList {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  justify-content: center;
  margin: 40px auto 0;
  width: 90%;
  max-width: 1200px

}

.libAboutCustomerList__item {
  display: table;
  height: 100px;
  width:50%;
  max-width: 240px
}

.libAboutCustomerList__item__imageArea {
  display: table-cell;
  height: 100%;
  vertical-align: middle;
  width: 100%
}

@media screen and (min-width: 769px) {
 .libAboutLogo {
   background: #fff;
 }
}

.js-slider-logo .libAboutCustomerList__item__imageArea {
  display: flex;
  width: 100%;
  height: 100%;
  vertical-align: middle;

}

.libAboutCustomerList__item__image {
  display: block;
  height: auto;
  margin: auto;
  max-height: 100%;
  max-width: 100%;
  width: auto
}

.js-slider-logo .libAboutCustomerList__item__image {
  max-width: 80%;
  max-height: 60%
}

@media screen and (max-width: 768px) {
  .libAboutCustomerList {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 24px;
  }
  .libAboutCustomerList__item {
    height: 76px;
    max-width: 200px;
    text-align: center;
    width: 50%;
  }
  .libAboutCustomerList__item__image {
    height: auto;
    max-height: 100%;
    max-width: 120px;
    width: auto;
  }
}
.libAboutCustomer__recommend {
  color: #666;
  font-size: 18px;
  margin-top: 40px;
  text-align: center
}

.libAboutCustomer__recommend--strong {
  color: #937f4e;
  font-weight: 700
}
@media screen and (max-width: 768px){
  .libAboutCustomer__recommend {
    font-size: 16px;
  }
}

.libAboutCase {
  padding: 0 0 80px
}

.libAboutCase__inner {
  border-top: 1px dotted #ccc;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0 auto;
  padding-top: 80px;
  width: 90%;
  max-width: 1200px
}

.libAboutCase__heading {
  color: #666;
  font-size: 24px;
  text-align: center
}

.libAboutCase__item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: flex-start;
  margin-top: 80px
}

.libAboutCase__image {
  height: auto;
  margin-right: 40px;
  width:100%;
  max-width: 480px
}

.libAboutCase__textArea {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  text-align: justify;
  text-justify: inter-ideograph
}

.libAboutCase__office {
  color: #666;
  font-weight: 700;
  margin-bottom: 8px
}

.libAboutCase__title {
  color: #252a5e;
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 16px
}

.libAboutCase__text--strong {
  border-bottom: 1px solid #b39b5f
}

.libAboutCase__role {
  color: #999;
  font-size: 14px;
  margin-top: 20px
}

.libAboutUser {
  padding: 0 0 80px
}

.libAboutUser__inner {
  border-top: 1px dotted #ccc;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0 auto;
  padding-top: 80px;
  width: 90%;
  max-width: 1200px
}

.libAboutUser__heading {
  color: #666;
  font-size: 24px;
  text-align: center
}

.libAboutUser__voice {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  justify-content: space-between;
}

.libAboutUser__voice__item {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  margin-top: 80px;
  text-align: justify;
  text-justify: inter-ideograph;
  width: calc(50% - 40px)
}
@media screen and (max-width: 1024px) {
  .libAboutCase__inner {
    max-width: 480px;
  }
  .libAboutCase__item {
    flex-wrap: wrap;
    margin-top: 40px;
  }
  .libAboutCase__heading {
    font-size: 20px;
  }
  .libAboutCase__title {
    font-size: 18px;
  }
  .libAboutCase__text,
  .libAboutUser__voice__text {
    font-size: 14px;
    line-height: 2.3;
  }
  .libAboutCase__textArea {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-top: 16px;
    text-justify: inter-ideograph;
  }
}
.libAboutUser__voice__head {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  margin-bottom: 12px
}

.libAboutUser__voice__icon {
  height: 80px;
  margin-right: 16px;
  width: 80px
}

.libAboutUser__voice__name {
  color: #666;
  font-size: 14px;
  margin-bottom: 8px
}

.libAboutUser__voice__title {
  color: #252a5e;
  font-size: 18px;
  font-weight: 700;
}

.libAboutUser__voice__text--strong {
  border-bottom: 1px solid #b39b5f
}

.libAboutUser__voice__role {
  color: #999;
  font-size: 14px;
  margin-top: 8px
}
@media screen and (max-width: 768px) {
  .libAboutUser__voice__head {
    margin-bottom: 8px
  }
  .libAboutUser__voice { 
    width:100%;
    margin: 0 auto
  }
  .libAboutUser__voice__name {
    margin-bottom: 0
  }
  .libAboutUser__voice__icon {
    height: 40px;
    margin-right: 16px;
    width: 40px;
  }
  .libAboutUser__voice__item {
    margin-top: 64px;
    width: 100%
  }
}

.libAboutPlan {
  margin: -136px auto 0;
  padding: 136px 0 0
}
.libAboutPlan__heading {
  color: #666;
  font-size: 24px;
  text-align: center
}

@media screen and (min-width: 1025px){

}
@media screen and (min-width: 768px) and (max-width: 1024px){

}
@media screen and (max-width: 768px) {
  .libAboutPlan {
    margin-top: 0;
    padding: 0px 16px 160px
  }

  .libAboutPlan__heading {
    color: #666;
    font-size: 20px;
    margin-bottom: 40px;
    text-align: center
  }

}

.libAboutTabContainer {
  margin: 0 auto
}

.libAboutTabContainer+* {
  border-top: 1px solid #ddd;
  margin-top: 40px;
  padding-top: 40px
}

.libAboutTab__btn {
  background-color: #fff;
  color: #ccc;
  display: block;
  float: left;
  font-weight: 700;
  padding: 15px 0;
  position: relative;
  text-align: center;
  -webkit-transition: all .2s ease;
  -o-transition: all .2s ease;
  transition: all .2s ease;
  width: 50%
}

.libAboutTab__btn:hover {
  color: #999;
  cursor: pointer
}

.libAboutTab__btn:hover:after {
  background-color: #999;
  bottom: 0;
  content: "";
  display: inline-block;
  height: 4px;
  left: 50%;
  position: absolute;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  width: 100px
}

.libAboutTab__btn[for=tab1] {
  padding-left: 114px;
  width: 350px
}

.libAboutTab__btn[for=tab1]:after {
  margin-left: 58px
}

.libAboutTab__btn[for=tab2] {
  padding-right: 114px;
  width: 350px
}

.libAboutTab__btn[for=tab2]:after {
  margin-left: -58px
}

input[name=tab__btn] {
  display: none
}

.libAboutTabContainer__content {
  border-top: 1px solid #eee;
  clear: both;
  display: none;
  overflow: hidden;
  padding-top: 40px
}

#tab1:checked~#tab1_content,#tab2:checked~#tab2_content {
  display: block
}

.libAboutTabContainer input:checked+.libAboutTab__btn {
  color: #666
}

.libAboutTabContent__marker {
  background:linear-gradient(transparent 60%, #fff000 60%);
}

.libAboutTabContainer input:checked+.libAboutTab__btn:after {
  background-color: #999;
  background-color: #252a5e;
  bottom: 0;
  content: "";
  display: inline-block;
  height: 4px;
  left: 50%;
  position: absolute;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  width: 100px
}

.libAboutTabContainer input:checked+.libAboutTab__btn[for=tab1]:after {
  margin-left: 58px
}

.libAboutTabContainer input:checked+.libAboutTab__btn[for=tab2]:after {
  margin-left: -58px
}

.libAboutTabContent {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 40px
}

.libAboutTabContent[data-theme=few] {
  margin: 0 auto;
  width: 700px
}

#tab2_contentInner {
  display: block;
  position: relative;
  top: -200px
}

.libAboutTabContent__inner {
  background-color: #fafafa;
  margin: 0 auto;
  padding: 40px 36px;
  position: relative;
  width: 33%
}

.libAboutTabContent__inner+.libAboutTabContent__inner {
  margin-left: 20px
}

.libAboutTabContent__inner[data-theme=wide] {
  width: 268px
}

.libAboutTabContent__free {
  border: 1px solid #ddd;
  color: #666;
  margin-left: 30px;
  padding: 40px;
  position: relative;
  text-align: center
}

.libAboutTabContent__free:before {
  border: 31px solid rgba(0,0,0,0);
  border-right-color: #ddd;
  content: "";
  left: -63px;
  margin-top: -16px;
  position: absolute;
  top: 42.5%
}

.libAboutTabContent__free:after {
  border: 30px solid rgba(0,0,0,0);
  border-right-color: #fff;
  content: "";
  left: -60px;
  margin-top: -15px;
  position: absolute;
  top: 42.5%
}

.libAboutTabContent__tag {
  left: 40px;
  position: absolute;
  top: -4px;
  width: 30px
}

.libAboutTabContent__free__icon {
  margin-bottom: 20px;
  width: 90px
}

.libAboutTabContent__free__title {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 10px;
  width: 248px
}

.libAboutText--gold {
  color: #937f4e
}

.libAboutTabContent__free__text {
  font-size: 14px;
  text-align: left;
  width: 248px
}

.libAboutTabContent__name {
  font-size: 20px;
  font-weight: 700;
  text-align: center
}

.libAboutTabContent__nameInfo {
  color: #666;
  font-size: 12px;
  margin-top: 4px;
  text-align: center;
  vertical-align: middle
}

.libAboutTabContent__text {
  color: #666;
  font-size: 14px;
  margin-top: 24px
}

.libAboutTabContent__price--small {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 5px;
  text-align: center
}

.libAboutTabContent__price {
  border-top: 1px solid #666;
  font-size: 46px;
  font-weight: 700;
  letter-spacing: .01em;
  margin-top: 16px;
  padding: 30px 0 30px;
  text-align: center;
  line-height: 1
}

.libAboutTabContent__priceText {
  display: block;
  padding: 10px 0;
  font-size: 24px;
}

.libAboutTabContent__priceInfo {
  font-size: 14px;
  margin-left: 3px
}

.libAboutTabContent__userContainer {
  text-align: center
}

.libAboutTabContent__user {
  border: 1px solid #666;
  color: #666;
  display: inline-block;
  font-size: 10px;
  font-weight: 700;
  padding: 4px 12px;
  text-align: center
}

.libAboutTabContent__userInfo {
  display: inline-block;
  font-size: 14px;
  margin-left: 10px
}

.libAboutTabContent__infoBox {
  background-color: #fff;
  color: #666;
  margin-top: 20px;
  padding: 16px;
  text-align: center
}

.libAboutTabContent__infoBox__title {
  font-size: 14px;
  font-weight: 700
}

.libAboutTabContent__infoBox__title--strong {
  font-size: 20px
}

.libAboutTabContent__infoBox__text {
  font-size: 10px
}

.libAboutTabContent__list {
  color: #666;
  font-size: 14px;
  margin-top: 16px;
  text-align: left
}

.libAboutTabContent__list__item+.libAboutTabContent__list__item {
  margin-top: 8px
}

.libAboutTabContent__list__item:before {
  background-color: #ddd;
  border-radius: 50%;
  content: "";
  display: inline-block;
  height: 7px;
  margin-right: 16px;
  vertical-align: middle;
  width: 7px
}

.libAboutTabContent__list__item[data-theme=image]:before {
  display: none
}

.libAboutTabContent__list__item__announce {
  color: #937f4e;
  font-weight: 700
}

.libAboutTabContent__recommend__icon {
  position: absolute;
  top: 0;
  right:0;
  width:58px;
}

.libAboutTabContent__list__item__icon {
  margin-bottom: 2px;
  margin-right: 10px;
  width: 16px
}

.libAboutTabContent__list__item__note {
  display: block;
  font-size: 10px;
  margin-left: 24px;
  margin-top: 2px
}

.libAboutTabDescription {
  color: #666;
  display: table;
  font-size: 14px;
  line-height: 1;
  margin: 20px auto 0
}
@media screen and (max-width: 768px) {
  .libAboutTabContent {
    flex-wrap: wrap
  }
  .libAboutTabContent__inner,
.libAboutTabContent__inner+.libAboutTabContent__inner {
    margin: 0 auto 16px;
    padding: 24px;
    width: 25em;
  }
  .libAboutTabDescription {
    font-size: 14px;
    margin-top: 16px;
  }
}
.libAboutPlan__textLink {
  border-bottom: 1px solid #666;
  color: #666;
  display: table;
  font-size: 14px;
  line-height: 1;
  margin: 16px auto 40px
}

.libAboutBl__title {
  color: #666;
  margin-top: 24px;
  margin-bottom: 16px;
  text-align: center
}

.libAboutBl__description {
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  justify-content: center
}

.libAboutBl__image {
  height: auto;
  margin-right: 40px;
  width: 120px
}

.libAboutBl__list {
  margin-left: 8px
}

.libAboutBl__list__item {
  font-size: 14px;
  line-height: 1.8
}

.libAboutBl__list__item:before {
  background-color: #ddd;
  border-radius: 50%;
  content: "";
  display: inline-block;
  height: 7px;
  margin-right: 16px;
  vertical-align: middle;
  width: 7px
}
@media screen and (max-width: 768px) {
  .libAboutBl__description {
    margin-left: auto;
    margin-right: auto;
    width:23em;
    display: block;
    text-align: center;
  }
  .libAboutBl__image {
    height: auto;
    margin:20px auto 20px;
    width: 200px;
  }
  .libAboutBl__list {
    margin-left: auto;
    margin-right: auto;
  }
  .libAboutBl__list__item {
    padding-left:1em;
    position: relative;
    font-size: 14px;
    line-height: 1.8;
    text-align: left;
  }
  .libAboutBl__list__item:before {
    background-color: #ddd;
    border-radius: 50%;
    content: "";
    display: inline-block;
    height: 7px;
    left: 0;
    margin: 0;
    position: absolute;
    top: 8px;
    width: 7px;
  }
}
@media screen and (max-width: 414px) {
  .libAboutBl__title {
    font-size: 15px
  }
  .libAboutBl__description {
    width: 90%;
    margin: 0 auto;
  }
}
.libAboutPlan__graph {
  padding: 80px 0 40px
}

.libAboutPlan__graph__heading {
  border-bottom:2px solid #b39b5f;
  margin-bottom: 24px;
  font-size:24px;
}

.libAboutPlan__graph__heading--gold {
  color: #b39b5f;
  font-size:130%;
  font-weight:600;
}

.libAboutPlan__graph__item {
  display: flex;
  justify-content: space-between;
  margin: 0 auto 40px
}

.libAboutPlan__graph__image {
  max-width:530px;
}
.libAboutPlan__graph__text {
  padding-left: 2em
}

@media screen and (max-width: 768px) {
  .libAboutPlan__graph {
    margin-top: -40px;
  }
  .libAboutPlan__graph__item{
    display:block;
    width:80%;
    margin: 0 auto 0
  }
  .libAboutPlan__graph__image {
    max-width:100%;
    margin-bottom: 40px
  }
  .libAboutPlan__graph__text {
    padding-left: 0
  }
}

@media screen and (max-width: 414px) {  .libAboutTabContent__inner {
    margin: 0 auto 0;
  } .libAboutTabContent__inner+.libAboutTabContent__inner {
    margin: 32px auto 0;
  }
  .libAboutPlan {
      padding: 0px 0 40px;
  }
  .libAboutPlan__graph__heading {
    text-align: center
  }
  .libAboutPlan__graph {
    margin-top: -80px;
  }
  .libAboutPlan__graph__item {
    width: 90%;
  }
}



.libAboutAction {
  position: relative;
  margin: 56px auto 40px;
  text-align: center
}

.libAboutAction--navy {
  background-color: #252a5e;
  color: #fff;
  padding: 80px 20px;
  text-align: center
}

.libAboutAction__title {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 24px
}
@media screen and (max-width: 768px) {
  .libAboutAction__title {
    font-size: 18px;
  }
}

.libAboutActionBtn {
  width:90%;
  max-width:500px;
  margin: 0 auto
}

.libAboutActionBtn__microCopy {
  position: relative;
  margin-bottom: 24px;
  font-size: 16px;
}

.libAboutActionBtn__microCopy:before,
.libAboutActionBtn__microCopy:after {
  position: absolute;
  top: 0;
  content: "";
  width: 1px;
  height: 100%;
  background: #000;
  border-radius: 3px;
}
 
.libAboutActionBtn__microCopy:before {
  left: 0;
  transform: rotate(-35deg);
}
 
.libAboutActionBtn__microCopy:after {
  right:0;
  transform: rotate(35deg);
}

.libAboutAction--navy .libAboutActionBtn__microCopy:before,
.libAboutAction--navy .libAboutActionBtn__microCopy:after {
  display:none;
}


.libAboutActionBtn__link {
  display: block;
  border-radius: 3px;
  padding: 24px 0;
  cursor: pointer;
  font-size: 24px;
  font-weight: 700;
  letter-spacing: .1em;
  text-align: center
}

.libAboutActionBtn__link span {
  position: relative;
  display: inline-block;
  padding-right: 1em
}

.libAboutActionBtn__link span::after{
  content: '';
  position: absolute;
  top:36%;
  right: 2px;
  width: 8px;
  height: 8px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  transition: all .3s;
}

.libAboutActionBtn__link:hover span::after{
  right: -4px;
}

.libAboutActionBtn__link[data-theme=default] {
  background: #252a5e;
  color: #fff;
  -webkit-transition: all .3s;
  -o-transition: all .3s;
  transition: all .3s
}

.libAboutActionBtn__link[data-theme=default]:hover {
  background: #3c4295
}

.libAboutActionBtn__link[data-theme=gold] {
  background: #b39b5f;
  -webkit-box-shadow: inset 0 -1px 0 0 #99854d;
  box-shadow: inset 0 -1px 0 0 #99854d;
  color: #fff;
  -webkit-transition: all .3s;
  -o-transition: all .3s;
  transition: all .3s
}

.libAboutActionBtn__link[data-theme=gold]:hover {
  background: #beaa77
}
@media screen and (min-width: 1260px) {
  .libAboutActionBtn__link--sp {
    display:none;
  }
  .libAboutActionBtn__link--pc {
    display:block;
  }
}
@media screen and (max-width: 1259px) {
  
  .libAboutActionBtn__link--pc {
    display:none;
  }
  .libAboutActionBtn__link--sp {
    display:block;
  }
}

@media screen and (min-width: 769px) {
  .libAboutAction__footer { display:none !important;
  }  
}
@media screen and (max-width: 768px) {
  
  .libAboutActionBtn__link {
    font-size: 18px;
  }
  .libAboutAction__footer {
    position: fixed;
    bottom:0;
    left: 0;
    right: 0;
    width:100%;
    background:rgba(255,255,255,.8);
    padding: 24px;
    z-index: 999
  }
  .libAboutAction__footer .libAboutActionBtn__link {
    padding: 16px 0;
  }
}
/* ------ form_parts ----- */
.formItem {
  margin: 2.4rem 0;
}

.formItem label {
  margin-top: 8px;
  display: block;
}

.formItem div label:first-child {
  margin-top: 0;
}

.formLabel {
  color: #666;
  font-size: 1.4rem;
  display: inline-block;
  margin: 0 0 1.4rem;
}

.formLabel__must {
  color: #cb320f;
  font-size: 1rem;
  margin-left: 8px;
  vertical-align: middle;
  display: inline-block;
}

.formParts label {
  display: block;
}

input[type=email],
input[type=password],
input[type=search],
input[type=text],
input[type=tel]{
  font-size: 16px;
  line-height: 1.4;
  border: 1px solid #ddd;
  border-radius: 3px;
  box-shadow: inset 1px 1px 3px 0 #eee;
  padding: 6px 10px 12px;
  box-sizing: border-box;
  width: 100%;
  -webkit-appearance: textfield;
  transition: all .3s;
}

select {
  color: #333;
  border: 1px solid #ccc;
  box-shadow: inset 0 -1px 0 0 #eee;
  background: #fff;
  border-radius: 3px;
  width:100%;
  height: 40px;
  display: inline-block;
  vertical-align: middle;
  padding: 0 50px 0 10px;
  box-sizing: border-box;
  font-size: 1.4rem;
  cursor: pointer;
}

select::-ms-expand {
  display: none;
}

textarea {
  width: 100%;
  height: 3em;
  border: 1px solid #ddd;
  border-radius: 3px;
  box-shadow: inset 1px 1px 3px 0 #eee;
  padding: 10px;
  box-sizing: border-box;
  font-size: 1.6rem;
  vertical-align: bottom;
}

input[type=checkbox],
input[type=radio] {
  display: inline-block;
  vertical-align: middle;
  margin:3px 8px 3px 0;
  width: 20px;
  height: 20px;
}

.formButtonWrap {
  margin: 32px 0;
}

.formButton {
  font-size: 16px;
  font-weight: bold;
  text-align: center;
  padding: 16px;
  display: block;
  transition: all .3s;
  border: none;
  border-radius: 3px;
  width: 100%;
}
.ss_btnArea { text-align: center}

.ss_btnArea p { position: relative}

.ss_btnArea input {
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-weight: bold;
  font-size: 16px;
  background: #252a5e;
  box-shadow: inset 0 -1px 0 0 #000;
  border-radius: 3px;
  transition: all .3s;
  margin: 16px auto 0;
  padding: 0.8em 0;
  min-height: 50px;
  width: 80%;
  max-width: 300px;
  cursor: pointer;
  -webkit-appearance: none;
  transition: 0.5s ease-in-out;
}
.ss_btnArea input.js--clicked {
  color: #252a5e;
  pointer-events: none;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.js--loading {
  position: absolute;
  left: 50%;
  top: 10px;
  margin-left: -12px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  border: 0.25rem solid rgba(255, 255, 255, 0.2);
  border-top-color: rgb(255, 255, 255);
  animation: spin 1s infinite linear;
}






.ss_btnArea input:hover {
  opacity: 0.8
}
.formButton[data-theme=default] {
  color: #333;
  font-weight: bold;
  background: #fff;
  border: 1px solid #ccc;
  box-shadow: inset 0 -1px 0 0 #eee;
  transition: all .3s;
  text-decoration: none;
  width: auto;
}

.formButtonWrap button + .formButton {
  margin-top: 24px;
}

.ss_field {
  margin: 0 0 0.4em;
}

.ss_grid { width:100%;}

.ss_form_title { 
  position: relative;
  padding: 0 0 0 42px;
  font-size: 14px;
  font-weight: 600;
}

#ss_VisitorData.attribute22 > .ss_form_title { 
  padding: 0 ;
}
#ss_VisitorData.attribute2778 
 > .ss_form_title { 
  font-size:12px;
}

.ss_input {
  position: relative;
  font-size:14px;
}
#ss_name .ss_grid {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#ss_name .ss_input {
  width:48%;
}
.ss_rightComment {
  position: absolute;
  bottom: 0px;
  left: 12px;
  color: #999;
  font-size: 12px;
  pointer-events: none;
}

@media screen and (max-width: 768px) {
  .ss_input {
    margin: 4px 0;
  }
  input[type=checkbox],
  input[type=radio] {
    margin:6px 8px 6px 0;
  }
}

/*
input:focus + span ,
.ss_rightComment.completed {
  bottom: 5px;
  left: 0;
  color: #ccc;
  font-weight: bolder;
  transform: scale(0.9) translateX(0) translateY(10px);
}*/

.ss_privacy_field{
  margin: 0 auto 1em;
}

.ss_privacy_field .ss_form_title {
  display:none;
}
.ss_user_notnull {
  display: inline-block;
  text-indent: -9999px
}
.ss_user_notnull:after {
  content: "";
  background: #937f4e url("../img/img_required.png")no-repeat center;
  background-size:24px auto;
  width: 28px;
  height: 12px;
  padding: 4px 4px;
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
}
.ss_warning_label {
  padding: 0 3px;
  background: #e2846c;
  border-radius: 20px;
  color: #fff;
}
.ss_error_msg {
  color: #e2846c;
  font-size: 12px;
}

.ss_field > .ss_form_title::after {
  content: "";
  background: url(../img/img_optional.png)no-repeat center;
  background-size: auto 12px;
  border: 2px solid #888;
  width: 24px;
  height: 10px;
  padding: 4px 4px;
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
}

.ss_field.ss_required_field .ss_form_title::after {
  display: none
}

.ss_leftComment { display:none;}

#ss_contentsNoMenu { text-align: center}

@media screen and (max-width: 768px) {
  .ss_field, .ss_grid {
    flex-wrap: wrap;
  }
}
/* ------ step ----- */

.formStep {
  display: -ms-flexbox;
  display: flex;
  box-sizing: border-box;
  margin: 40px 0;
  padding: 0 16px;
  counter-reset: number;
  position: relative;
}

.formStep:before {
  content: '';
  width: 100%;
  height: 2px;
  background-color: #eee;
  position: absolute;
  left: 0;
}

.formStep li {
  width: 25%;
  margin: 0 auto;
  padding: 24px 0 0;
  color: #666;
  font-size: 1.2rem;
  text-align: center;
  position: relative;
}

.formStep li:before {
  content: counter(number);
  counter-increment: number;
  color: #b49c5b;
  font-weight: 400;
  margin-right: 3px;
}

.formStep li:after {
  position: absolute;
  top: -4px;
  left: 50%;
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-left: -4px;
  content: '';
  border-radius: 50%;
  border: 2px solid #ddd;
  background-color: #fff;
}

.formStep .is_current {
  color: #252a5e;
  font-weight: bold;
}

.formStep .is_current:after {
  border: 2px solid #252a5e;
}

.formStep .is_end,.formStep .is_end:before {
  color: #ddd;
}


/*thanks page */
.libAboutHeader__servicelogo {
  -ms-flex-preferred-size: 324px;
  background: url(../img/logo_lib.svg) 0 no-repeat;
  background-size: auto 100%;
  display: block;
  flex-basis: 324px;
  width: 324px;
  height: 32px;
  overflow: hidden;
  text-indent: -999em;
  -webkit-transform: all .2s;
  -ms-transform: all .2s;
  transform: all .2s
}

.libAboutHeader__servicelogo__link {
  display: block
}
@media screen and (max-width: 767px) {
  .libAboutHeader .libAboutHeader__inner{
    height: auto;
    padding: 0.5em 0;
  }
  .libAboutHeader__servicelogo {
    background-size: 180px auto;
  }
}
.formContents {
  margin: 80px auto ;
  width: 95%;
  max-width: 1200px;
}
.formContents p {
  margin-bottom: 1.5em
}
.pagetop {
    background: #ddd;
    color: #333;
    display: block;
    font-size: 14px;
    font-weight: 700;
    padding: 20px 0;
    text-align: center;
}
/*form*/
.libAbout__form__inner--main iframe { 
  height:97vh;
}
@media screen and (max-width: 768px) {
  .libAbout__form__inner--main iframe { 
    height:115vh;
  }
}