@charset "UTF-8";
/*=============================================================
 02_base
=============================================================*/
/*  02_base
================================================ */
html { overflow: auto; }

body { min-width: 320px; font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN W3", Meiryo, sans-serif; color: #333; font-size: 1.4rem; line-height: 1.7; letter-spacing: .08em; overflow: hidden; }

@media all and (min-width: 600px) { body { font-size: 1.6rem; min-width: 1200px; } }

a { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; color: inherit; text-decoration: underline; }

@media all and (min-width: 600px) { a:hover { text-decoration: none; }
  a.opacity:hover { opacity: .7; }
  a[href^=tel] { pointer-events: none; } }

em, strong, span { font-weight: inherit; }

input, button, textarea, select { -webkit-appearance: none; -moz-appearance: none; appearance: none; }

input[type="button"], input[type="text"], input[type="submit"], input[type="image"], textarea { -webkit-appearance: none; border-radius: 0; }

img { width: 100%; height: auto; }

/* pc <--> sp
-------------------------------------- */
#mediaQuery { display: none; font-family: 'sp'; }

@media all and (min-width: 600px) { #mediaQuery { font-family: 'pc'; } }

@media all and (max-width: 599px) { .viewPc { display: none; } }

@media all and (min-width: 600px) { .viewSp { display: none; } }

/* font
-------------------------------------- */
.is_font_oswald { font-family: 'Oswald', sans-serif; font-weight: 600; }

/* clearfix
-------------------------------------- */
.cf:after { content: ''; display: block; clear: both; }

/* layout
-------------------------------------- */
#wrapper { position: relative; padding-top: 59px; }

@media all and (min-width: 600px) { #wrapper { padding-top: 90px; } }

/*=============================================================
 03_layout
=============================================================*/
/* #breadcrumb
================================================ */
#breadcrumb .list { padding: 8px 10px 25px; }

#breadcrumb .list .item { display: inline-block; }

#breadcrumb .list .item + .item { padding-left: 5px; }

#breadcrumb .list .item + .item:before { content: ">"; margin-right: 4px; }

/* #gFooter
================================================ */
#gFooter { padding-top: 20px; background-color: #333694; }

#gFooter .contact { margin-bottom: 30px; }

#gFooter .contact a { display: block; border: 1px solid #b3a9c7; text-align: center; color: #fff; text-decoration: none; padding: 40px 42px 30px; }

#gFooter .contact a .tit { font-size: 3.5rem; line-height: 1.1; letter-spacing: 0.1em; margin: 0 -42px 15px; }

#gFooter .ftInfo .ftSns .list { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }

#gFooter .ftInfo .ftSns .list .btn { margin-right: 20px; }

#gFooter .ftInfo .ftSns .list .btn.tw { width: 30px; }

#gFooter .ftInfo .ftSns .list .btn.fb { width: 11px; }

#gFooter .ftInfo .ftSns .list .btn.ig { width: 25px; }

#gFooter .ftInfo .ftSns .list .btn.logo { width: 143px; margin-right: 0; }

#gFooter .cr { color: #8586bf; text-align: center; font-size: 1.2rem; padding: 35px 0 25px; }

@media all and (min-width: 600px) { #gFooter { padding-top: 90px; }
  #gFooter .contact { margin-bottom: 60px; }
  #gFooter .contact a { padding: 70px 0 62px; position: relative; }
  #gFooter .contact a .tit { font-size: 4.6rem; margin: 0 0 25px; }
  #gFooter .contact a .txt { font-size: 1.9rem; }
  #gFooter .contact a:before { content: ''; background-color: rgba(29, 32, 136, 0.5); position: absolute; top: 0; left: 0; width: 0; height: 100%; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
  #gFooter .contact a:hover:before { width: 100%; }
  #gFooter .ftInfo { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
  #gFooter .ftInfo .ftNav .list { display: -webkit-box; display: -ms-flexbox; display: flex; }
  #gFooter .ftInfo .ftNav .list .item + .item { margin-left: 32px; }
  #gFooter .ftInfo .ftNav .list .item a { color: #fff; text-decoration: none; letter-spacing: 0.04em; }
  #gFooter .ftInfo .ftNav .list .item a:hover { opacity: 0.6; }
  #gFooter .ftInfo .ftSns .list { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
  #gFooter .ftInfo .ftSns .list .btn { margin-right: 35px; }
  #gFooter .ftInfo .ftSns .list .btn a { display: block; }
  #gFooter .ftInfo .ftSns .list .btn a:hover { opacity: 0.6; }
  #gFooter .ftInfo .ftSns .list .btn.tw { width: 37px; }
  #gFooter .ftInfo .ftSns .list .btn.fb { width: 10px; }
  #gFooter .ftInfo .ftSns .list .btn.ig { width: 22px; }
  #gFooter .ftInfo .ftSns .list .btn.logo { width: 153px; margin-right: 0; }
  #gFooter .cr { text-align: left; font-size: 1.3rem; padding: 45px 0 40px; } }

/* #pagetop
================================================ */
@media all and (max-width: 599px) { #pagetop { position: static !important; } }

#pagetop a { display: block; padding: 10px; background: #000; color: #fff; text-align: center; text-decoration: none; }

@media all and (min-width: 600px) { #pagetop { opacity: 0; visibility: hidden; position: fixed; right: 0; bottom: 0; margin: 0 30px 30px 0; -webkit-transition: opacity 0.3s ease; transition: opacity 0.3s ease; }
  #pagetop.is_view { opacity: 1; visibility: visible; }
  #pagetop a { display: block; width: 50px; height: 50px; padding: 12px 0 0; border-radius: 25px; box-sizing: border-box; } }

/* #gHeader
================================================ */
#gHeader { position: fixed; top: 0; left: 0; width: 100%; min-width: 320px; z-index: 2000; height: 59px; background-color: #fff; }

@media all and (min-width: 600px) { #gHeader { height: 90px; min-width: 1200px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } }

/* #hdInfo
-------------------------------------- */
#hdInfo { position: relative; z-index: 3; padding: 18px 0 0 18px; box-sizing: border-box; }

#hdInfo .logo { float: left; width: 153px; }

#hdInfo .btnGnav { position: absolute; top: 0; right: 0; width: 59px; height: 59px; background: #1d2088; cursor: pointer; }

#hdInfo .btnGnav .line { position: absolute; left: 16px; width: 26px; height: 2px; content: ''; background: #fff; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }

#hdInfo .btnGnav .line:nth-child(1) { top: 20px; }

#hdInfo .btnGnav .line:nth-child(2) { top: 28px; }

#hdInfo .btnGnav .line:nth-child(3) { top: 36px; }

#hdInfo .btnGnav.is_open .line:nth-child(1) { top: 28px; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }

#hdInfo .btnGnav.is_open .line:nth-child(2) { opacity: 0; }

#hdInfo .btnGnav.is_open .line:nth-child(3) { top: 28px; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }

@media all and (min-width: 600px) { #hdInfo { padding: 32px 0 0 30px; top: 0; left: 0; }
  #hdInfo .logo { width: 202px; } }

/* #gNav
================================================ */
#gNav { display: none; position: absolute; top: 59px; left: 0; z-index: 2; width: 100%; min-width: 320px; background: #f5f5f5; box-sizing: border-box; -webkit-overflow-scrolling: touch; }

@media all and (max-width: 599px) { #gNav { overflow-y: scroll; } }

#gNav .search { padding: 30px 18px 20px; }

#gNav .search .searchIn { position: relative; }

#gNav .search .searchIn input[type="text"] { border: 1px solid #ccc; border-radius: 2px; background-color: #fff; width: 100%; box-sizing: border-box; padding: 17px; }

#gNav .search .searchIn input[type="submit"] { position: absolute; top: 20px; right: 18px; background: url(../img/common/ico_search01.png) 0 0 no-repeat; background-size: contain; width: 18px; height: 18px; text-indent: -9999px; }

#gNav .list { border-top: 1px solid #ccc; }

#gNav .list .item { border-bottom: 1px solid #ccc; }

#gNav .list .item a, #gNav .list .item .mainNav { display: block; font-size: 1.5rem; text-decoration: none; padding: 12px 18px; }

#gNav .list .item .mainNav { position: relative; }

#gNav .list .item .mainNav span { display: block; position: absolute; top: 50%; right: 18px; width: 19px; height: 19px; margin: -8px 0 0; }

#gNav .list .item .mainNav span:before, #gNav .list .item .mainNav span:after { position: absolute; top: 50%; left: 0; width: 16px; height: 2px; margin-top: -1px; background: #626262; content: ""; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }

#gNav .list .item .mainNav span:after { -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); }

#gNav .list .item .mainNav.is_active span:after { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); }

#gNav .list .item .sub { border-top: 1px solid #ccc; display: none; padding: 10px 0; }

#gNav .list .item .sub .subItem a { padding: 10px 35px; font-size: 1.3rem; }

#gNav .list .item.policy a { color: #808080; }

@media all and (min-width: 600px) { #gNav { position: static; display: block; width: 633px; margin-left: auto; margin-right: 40px; background-color: #fff; }
  #gNav .search { display: none; position: absolute; top: 90px; right: 0; padding: 20px; width: 100%; background-color: #f5f5f5; box-sizing: border-box; z-index: 1; }
  #gNav .search .searchIn { width: 648px; margin-left: auto; position: relative; }
  #gNav .search .searchIn input[type="submit"] { width: 20px; height: 20px; }
  #gNav .list { border-top: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 29px 0;}
  #gNav .list .item { border-bottom: none; position: relative; }
  #gNav .list .item a, #gNav .list .item .mainNav { font-size: 1.6rem; padding: 0; position: relative; letter-spacing: 0.04em; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
  #gNav .list .item a:before, #gNav .list .item .mainNav:before { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; content: ''; background-color: #1d2088; width: 0; height: 3px; position: absolute; bottom: -31px; left: 0; right: 0; margin: auto; }
  #gNav .list .item a:hover, #gNav .list .item .mainNav:hover { color: #1d2088; }
  #gNav .list .item a:hover:before, #gNav .list .item .mainNav:hover:before { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; width: 27px; }
  #gNav .list .item .mainNav { cursor: pointer; }
  #gNav .list .item .mainNav span { display: none; }
  #gNav .list .item .mainNav span:before, #gNav .list .item .mainNav span:after { content: none; }
  #gNav .list .item .sub { border-top: none; display: none; position: absolute; top: 58px; left: -110px; width: 300px; text-align: center; background-color: #f5f5f5; }
  #gNav .list .item .sub .subItem + .subItem { border-top: 1px solid #ccc; }
  #gNav .list .item .sub .subItem a { padding: 16px 20px; }
  #gNav .list .item .sub .subItem a:hover:before { width: 0; }
  #gNav .list .item.btnSearch { cursor: pointer; }
  #gNav .list .item.btnSearch span { display: block; width: 90px; height: 90px; background: #1d2088 url(../img/common/ico_search02.png) 50% 50% no-repeat; background-size: 24px; } }

/* #overlay
================================================ */
#overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: #f5f5f5; z-index: 1000; }

@media all and (min-width: 600px) { #overlay { display: none !important; } }

/* #mainVisual HOME
================================================ */
#mainVisual { position: relative; }

#mainVisual .slider .item { position: relative; }

#mainVisual .slider .item:before { content: ''; background-color: #1d2088; width: 0; height: 8px; position: absolute; bottom: 0; left: 0; z-index: 10; }

#mainVisual .slider .item.slick-active:before { -webkit-animation: animProgress 5s linear; animation: animProgress 5s linear; }

#mainVisual .inner .copy { position: absolute; top: 75px; left: 20px; font-size: 5.0rem; color: #fff; line-height: 1.1; }

#mainVisual .scroll { -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; position: absolute; bottom: 90px; left: 23px; }

#mainVisual .scroll a { text-decoration: none; color: #fff; }

#mainVisual .scroll:before { content: ''; background-color: #fff; width: 1px; height: 105px; position: absolute; bottom: -55px; left: -5px; -webkit-animation: animScroll 3s ease-in-out infinite; animation: animScroll 3s ease-in-out infinite; }

@media all and (min-width: 600px) { #mainVisual .inner .copy { width: 1200px; top: 150px; left: 0; right: 0; margin: auto; font-size: 10.0rem; }
  #mainVisual .scroll { bottom: 130px; left: 40px; }
  #mainVisual .scroll a { font-size: 1.4rem; } }

@-webkit-keyframes animScroll { 0% { height: 0;
    bottom: 50px; }
  50% { height: 105px;
    bottom: -55px;
    opacity: 1; }
  90% { opacity: 0.7; }
  95% { opacity: 0.2; }
  100% { height: 0px;
    bottom: -55px;
    opacity: 0; } }

@keyframes animScroll { 0% { height: 0;
    bottom: 50px; }
  50% { height: 105px;
    bottom: -55px;
    opacity: 1; }
  90% { opacity: 0.7; }
  95% { opacity: 0.2; }
  100% { height: 0px;
    bottom: -55px;
    opacity: 0; } }

@-webkit-keyframes animProgress { 100% { width: 100%; } }

@keyframes animProgress { 100% { width: 100%; } }

/* #mainImg
================================================ */
#mainImg { height: 245px; background-position: center; background-repeat: no-repeat; background-size: cover; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }

#mainImg .tit { color: #fff; text-align: center; font-size: 3.2rem; font-weight: 600; letter-spacing: .5px; line-height: 1.2; }

@media all and (min-width: 600px) { #mainImg { height: 490px; }
  #mainImg .tit { font-size: 7.6rem; letter-spacing: 3px; } }

/* #sidebar
================================================ */
/* .secSidebar
-------------------------------------- */
.secSidebar { margin-bottom: 20px; padding: 0 15px; }

@media all and (min-width: 600px) { .secSidebar { margin-bottom: 25px; padding: 0; } }

/*=============================================================
 05_helper
=============================================================*/
/* js-objectfit
================================================ */
.js-objectfit { display: block; overflow: hidden; }

.js-objectfit img { width: 100%; height: 100%; object-fit: cover; font-family: 'object-fit: cover; object-position: center;'; }