@charset "UTF-8";
/* CSS Document */
*, *:before, *:after{margin:0;padding:0;border: 0;font-weight: normal;vertical-align:baseline;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
body {
font-family: "Noto Sans JP", sans-serif;
font-size:15px;
font-weight:400;
line-height:1.9;
color:#231815;
letter-spacing:1px;
width:100%;
max-width: 1920px;
margin: 0 auto;
overflow-wrap: anywhere;
word-break: normal;
line-break: strict;
}
.page-top-wrap,.page-wrap,.page-itv-wrap {opacity: 0;}.wf-active .page-top-wrap,.wf-active .page-wrap,.wf-active .page-itv-wrap {opacity: 1;transition:.5s opacity;}
.nsb{font-family: "Noto Serif JP", serif;font-optical-sizing: auto;font-weight:600;}
.nssb{font-family: "Noto Serif JP", serif;font-optical-sizing: auto;font-weight:500;}
.pps{font-family: "Poppins", sans-serif;font-optical-sizing: auto;font-weight:500;}

.sp-only{
display: none;
}
ol, ul {
list-style: none;
list-style-type: none;
}
a:focus, *:focus { outline:none; }
a{
text-decoration: none;
color:#333;
}
a.link-ul{
text-decoration: underline;
color: #0000ff;
}
a.op07:hover{
opacity:0.7;
 transition: .4s opacity;
}
a:hover{
opacity:0.7;
transition: .4s opacity;
}
a.link-text{
text-decoration:underline;
}
img{
vertical-align:bottom;
}
img.w100{
width: 100%;
}
.table{
display:table;
width:100%;
height:100%;
}
.cell{
display:table-cell;
vertical-align:middle;
}
.scroll-effect{}
.fade-in{
opacity:0;
transition:opacity 1s;
}
.fade-in.scrolled{
opacity:1;
transition:opacity 1s;
}
.fade-in01{
opacity:0;
transition:opacity 1s;
}
.fade-in01.scrolled{
opacity:1;
transition:opacity 1s;
}
.fade-in02{
opacity:0;
transition:opacity 1s 0.5s;
}
.fade-in02.scrolled{
opacity:1;
transition:opacity 1s 0.5s;
}
.fade-in03{
opacity:0;
transition:opacity 1s 1s;
}
.fade-in03.scrolled{
opacity:1;
transition:opacity 1s 1s;
}
.fade-in04{
opacity:0;
transition:opacity 1s 1.5s;
}
.fade-in04.scrolled{
opacity:1;
transition:opacity 1s 1.5s;
}
.fade-in05{
opacity:0;
transition:opacity 1s 2s;
}
.fade-in05.scrolled{
opacity:1;
transition:opacity 1s 2s;
}
.move-up{
position:relative;
top:60px;
opacity:0;
transition:opacity 1s 0s,top 1s 0s;
}
.move-up.scrolled{
top:0;
opacity:1;
transition:opacity 1s 0s,top 1s 0s;
}
.move-up02{
position:relative;
top:120px;
opacity:0;
transition:opacity 1s 0.5s,top 1s 0.5s;
}
.move-up02.scrolled{
top:0;
opacity:1;
transition:opacity 1s 0.5s,top 1s 0.5s;
}
.move-up03{
position:relative;
top:120px;
opacity:0;
transition:opacity 1s 1s,top 1s 1s;
}
.move-up03.scrolled{
top:0;
opacity:1;
transition:opacity 1s 1s,top 1s 1s;
}
.move-up04{
position:relative;
top:120px;
opacity:0;
transition:opacity 1s 1.5s,top 1s 1.5s;
}
.move-up04.scrolled{
top:0;
opacity:1;
transition:opacity 1s 1.5s,top 1s 1.5s;
}
.move-to-right{
position:relative;
left:-180px;
opacity:0;
transition:opacity 1000ms,left 1000ms;
}
.move-to-right.scrolled{
left:0;
opacity:1;
transition:opacity 1000ms,left 1000ms;
}
.move-to-right02{
position:relative;
left:-180px;
opacity:0;
transition:opacity 1000ms,left 1000ms;
}
.move-to-right02.scrolled{
left:0;
opacity:1;
transition:opacity 1000ms,left 1000ms;
}
.move-to-left{
position:relative;
left:50px;
opacity:0;
transition:opacity 1000ms,left 1000ms;
}
.move-to-left.scrolled{
left:0;
opacity:1;
transition:opacity 1000ms,left 1000ms;
}
.move-down{
position:relative;
top:-100px;
opacity:0;
transition:opacity 1s 0s,top 1s 0s;
}
.move-down.scrolled{
top:0;
opacity:1;
transition:opacity 1s 0s,top 1s 0s;
}
.inner-1400{
width: 92%;
max-width: 1400px;
margin: 0 auto;
}
.inner-1300{
width: 92%;
max-width: 1300px;
margin: 0 auto;
}
.inner-1200{
width: 92%;
max-width: 1200px;
margin: 0 auto;
}
.inner-1100{
width: 92%;
max-width: 1100px;
margin: 0 auto;
}
.inner-1000{
width: 92%;
max-width: 1000px;
margin: 0 auto;
}
.inner-900{
width: 92%;
max-width: 900px;
margin: 0 auto;
}
.inner-800{
width: 92%;
max-width: 800px;
margin: 0 auto;
}



#top-main-v-wrap {
width: 100%;
max-width: 1500px;
overflow: hidden;
margin: 0 auto 100px;
position: relative;
}
.top-main-v-text{
position: absolute;
bottom: 50px;
left: 5%;
white-space:nowrap;
overflow:hidden;
animation-name: main-v-text;
animation-duration: 6s;
animation-fill-mode: both;
}
@keyframes main-v-text{
0%{width: 0%;}
10%{width: 0%;}
100%{width: 95%;}
}
.top-main-v-text h1{
font-size: 46px;
color: #fff;
line-height: 1.6;
}
.top-main-v-text p{
font-size: 20px;
color: #fff;
}
.top-main-v {
width: 100%;
overflow: hidden;
opacity: 0;
transition: opacity .3s linear;
}
.top-main-v.slick-initialized{
opacity: 1;
}
.slick-img img {
width: 100%;
}
@keyframes fdzm {
0% {transform: scale(1);}
100% {transform: scale(1.1);}
}
.animation {
animation: fdzm 6.4s 0s forwards;
}
.top-sec{
padding: 70px 4%;
}
.top-sec-ttl-box{
white-space:nowrap;
overflow:hidden;
width: 0;
}
.top-sec-ttl-box-c{
width:fit-content;
position: relative;
margin: 0 auto;
}
.top-sec-ttl-box-c .top-ttl-box-cover{
position: absolute;
width: 100%;
height: 100%;
background: #fff;
top: 0;
right: 0;
}
.top-sec-ttl-box-c.scrolled .top-ttl-box-cover{
animation-name: ttl-animation;
animation-duration: 2s;
animation-fill-mode: both;
}

.top-sec-ttl-box.scrolled{
animation-name: main-v-text;
animation-duration: 2s;
animation-fill-mode: both;
}
.top-sec h2{
font-size: 50px;
text-align: center;
line-height: 1.5;
}
.top-sec-ttl-sub{
text-align: center;
font-size: 19px;
font-weight: 500;
}
.top-sec-ttl-sub span{
font-family: "Noto Serif JP", serif;font-optical-sizing: auto;font-weight:600;
}
.top-sec p{
font-size: 16px;
text-align: center;
}
.top-msg-sec{
display: flex;
width: 92%;
max-width: 1000px;
margin: 0 auto;
padding: 0 0 100px;
justify-content: space-between;
}
.top-msg-sec-left{
width: 37%;
flex-shrink: 0;
}
.top-msg-sec h2{
font-size: 50px;
line-height: 1.5;
}
.top-msg-sec .top-sec-ttl-sub{
text-align: left;
}
.top-msg-sec-right{
width: 63%;
flex-shrink: 0;
padding: 20px 0 0;
}
.top-flowing{
width: 100%;
max-width: 1300px;
margin: 0 auto 100px;
overflow: hidden;
}
.scroll-container {
display: flex;
overflow: hidden;
width: 100%;
white-space: nowrap;
}
.scroll-content {
display: flex;
animation: scroll 35s linear infinite;
}
.remodal-is-locked .scroll-content {
animation-play-state: paused;
}
.item {
flex: 0 0 auto;
width: 340px;/*お好みの幅に調整*/
background-color: lightblue;
margin: 0 10px;/*左右の余白はここを調整*/
text-align: center;
font-size: 24px;
}
.item img {
width: 100%;
}
@keyframes scroll {
0% {transform: translateX(0);}
100% {transform: translateX(-100%);}
}
.top-about-btn{
width: 90%;
max-width: 720px;
height: 140px;
margin: 0 auto;
}
.top-col2-box,
.top-col3-box{
display: flex;
max-width: 1300px;
justify-content: space-between;
margin: 0 auto;
}
.top-col2-btn{
width: 48%;
height: 140px;
}
.top-col3-btn{
width: 31.5%;
height: 140px;
}
.top-about-btn a,
.top-col2-btn a,
.top-col3-btn a{
display: table;
width: 100%;
height: 100%;
text-align: center;
border: 1px solid #999;
position: relative;
overflow: hidden;
}
.top-about-btn a:hover,
.top-col2-btn a:hover,
.top-col3-btn a:hover{
opacity: 1;
}
.top-about-btn a::before,
.top-col2-btn a::before,
.top-col3-btn a::before{
position: absolute;
content: '';
width: 34px;
height: 34px;
bottom: -1px;
right: -1px;
background:url(../images/btn-arrow-square.png) no-repeat center center;
background-size: 34px 34px;
z-index: 10;
}
.top-about-btn a p,
.top-col2-btn a p,
.top-col3-btn a p{
display: table-cell;
vertical-align: middle;
font-size: 23px;
line-height: 1.5;
padding: 0 0 18px;
}
.top-about-btn a p span,
.top-col2-btn a p span,
.top-col3-btn a p span{
font-size: 14px;
}
.top-col2-btn a p,
.top-col3-btn a p{
text-align: left;
padding: 0 7% 18px;
}
.top-about-btn a::after,
.top-col2-btn a::after,
.top-col3-btn a::after {
background: #e0f5fe;
position: absolute;
top: 0;
left: 0;
content: '';
width: 100%;
height: 100%;
transform: scale(0, 1);
transform-origin: left top;
transition: .4s cubic-bezier(0.45, 0, 0.55, 1);
z-index: -1;
}
.top-about-btn a:hover,
.top-col2-btn a:hover,
.top-col3-btn a:hover{
text-align: center;
border: 1px solid #93c9e1;
}
.top-about-btn a:hover::after,
.top-col2-btn a:hover::after,
.top-col3-btn a:hover::after {
transform: scale(1, 1);
}
.top-itv-list-box{
width: 100%;
max-width: 1300px;
margin: 0 auto;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
}
.top-itv-list-once{
width: 31.5%;
margin: 0 0 40px;
}
.top-itv-list-once a{
display: block;
}
.top-itv-list-img{
position: relative;
margin: 0 0 14px;
}
.top-itv-list-img::before{
position: absolute;
content: '';
width: 34px;
height: 34px;
bottom: -1px;
right: -1px;
background:url(../images/btn-arrow-square-w.png) no-repeat center center;
background-size: 34px 34px;
z-index: 10;
}
.top-itv-list-once a:hover .top-itv-list-img::before{
background:url(../images/btn-arrow-square.png) no-repeat center center;
background-size: 34px 34px;
}
.top-itv-list-once p{
line-height: 1.7;
}
.top-itv-list-once p span{
font-size: 13px;
}
.page-top-wrap{
padding: 120px 0 140px;
overflow: hidden;
}
.page-wrap {
padding: 150px 0 80px;
overflow: hidden;
}
.page-itv-wrap{
padding: 150px 0 0;
overflow: hidden;
}
.page-ttl-box{
width:fit-content;
position: relative;
}
.page-ttl-box-cover{
position: absolute;
width: 100%;
height: 100%;
background: #fff;
top: 0;
right: 0;
animation-name: ttl-animation;
animation-duration: 2.4s;
animation-fill-mode: both;
}
@keyframes ttl-animation{
0%{width: 100%;}
80%{width: 0%;}
100%{width: 0%;}
}
.page-ttl-box h1{
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight:600;
font-size: 40px;
line-height: 1.3;
padding: 0 30px 14px 0;
letter-spacing: 0.1em;
display: inline-block;
}
.page-ttl-en{
font-size: 19px;
}
.page-ttl-line{
background: #93c9e1;
width: 28px;
height: 3px;
margin: 0 0 20px;
}







#global-header-wrap{
position: fixed;
top:0;
left: 0;
width: 100%;
z-index: 5000;
background: #fff;
border-bottom: 1px solid #999;
}
#global-header{
position: relative;
width: 100%;
max-width: 1400px;
margin: 0 auto;
}
#global-header-logo {
width: 380px;
height: 76px;
z-index: 201;
margin: 0 0 0 2%;
padding: 26px 0 10px 0;
position: relative;
overflow: hidden;
}
#global-header-logo img {
width: 180px;
float: left;
}
#global-header-logo p {
font-size: 0px;
float: left;
display: inline-block;
font-weight: 500;
padding: 2px 0 0 12px;
}
.wf-active #global-header-logo p{
font-size: 18px;
}
.only-site-name{
display: none;
}
#global-header-links{
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 76px;
}
.menu-btn,
.menu-btn.active{
position: absolute;
top: 0;
z-index: 5000;
width: 76px;
height: 76px;
}
.menu-btn{
right: 0;
}
.menu-btn.active .close-overlay-menu-wrap {
display: block;
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
z-index: 5001;
}
.menu-btn.active .close-overlay-menu-wrap:hover {
cursor: pointer;
}
.menu-btn a{
position: relative;
display:block;
width:100%;
height:100%;
background: #fff;
}
.menu-btn span{
display: inline-block;
transition: all .4s;
position: absolute;
left: 33%;
height: 1px;
background: #111;
width: 34%;
}
.menu-btn span:nth-of-type(1) {top:29px;}
.menu-btn span:nth-of-type(2) {top:37px;}
.menu-btn span:nth-of-type(3) {top:45px;}
.menu-btn.active span:nth-of-type(1) {
top: 32px;
left: 30%;
transform: translateY(6px) rotate(-45deg);
width: 40%;
}
.menu-btn.active span:nth-of-type(2) {
opacity: 0;
}
.menu-btn.active span:nth-of-type(3){
top: 44px;
left: 30%;
transform: translateY(-6px) rotate(45deg);
width: 40%;
}
.header-entry {
position: absolute;
top: 12px;
right: 76px;
width: 190px;
height: 52px;
}
.header-entry a{
display: block;
font-size: 0px;
color: #fff;
text-align: center;
line-height: 52px;
}
.wf-active .header-entry a{
font-size: 18px;
}


.modal-menu-inner{
width:92%;
max-width:1000px;
margin:0 auto;
padding:160px 0 50px;
display: flex;
justify-content: space-between;
}
.modal-menu-left{
width:32%;
}
.modal-menu-right{
width:56%;
}
.modal-menu-cat-box{
}
.modal-menu-inner a{
position: relative;
display:block;
line-height:2;
margin:0 0 4px;
padding: 4px 0;
}
.modal-menu-inner a:hover{
text-decoration: underline;
color: #e08738;
opacity: 1;
}
.modal-menu-cat-ttl{
width:100%;
font-size:24px;
margin:0 0 14px;
padding:0 0 4px;
border-bottom:1px solid #62b8de;
font-family: "Poppins", sans-serif;
font-weight: 500;
position:relative;
color: #62b8de;
}
.modal-menu-cat-ttl span{
padding: 0 6px 0 0;
font-size: 22px;
}
.entry-list {
width: 100%;
display: flex;
justify-content: center; /* メニューアイテムを中央揃えに */
flex-shrink: 0;
}
.entry-item {
width: 100%;
background-color: #93c9e1; /* メニューアイテムの背景色 */
position: relative;
transition: background-color .3s; /* 背景色の変化をアニメーション化 */
}
.entry-item:hover{
cursor: pointer;
}
/* メニューアイテムのホバースタイル */
.entry-item:hover .drop-entry-list{
transform: scaleY(1); /* ドロップダウンメニューの表示 */
}
.drop-entry-item:hover {
opacity: .8; /* ドロップダウンメニューアイテムのホバー時の不透明度 */
transition: opacity .3s; /* 不透明度の変化をアニメーション化 */
}
.entry-item a {
align-items: center;
color: #fff; /* メニューアイテム内のリンクテキストの色 */
display: flex;
height: 52px;
justify-content: center;
text-decoration: none; /* リンクの下線を非表示 */
width: 100%;
}
/* ドロップダウンメニュー */
.drop-menu {
position: relative;
}
.drop-entry-list {
left: 0;
position: absolute;
top: 100%;
transform: scaleY(0); /* ドロップダウンメニューの非表示 */
transform-origin: center top; /* 変形を適応する基準を設定 */
transition: transform .3s; /* 表示の変化をアニメーション化 */
width: 100%;
z-index: 1;
}
.drop-entry-item {
background-color: #417fc6; /* ドロップダウンメニューの背景色 */
transition: opacity .3s; /* 不透明度の変化をアニメーション化 */
}
.wf-active .header-entry .drop-entry-item a,
.foot-entry .drop-entry-item a{
font-size: 13px;
letter-spacing: 0;
}



.points-main{
width: 100%;
max-width: 820px;
margin: 0 auto
}
.points-main p{
font-size: 20px;
text-align: center;
}
.points-sec-wrap{
max-width: 1300px;
margin: 0 auto;
background: #eee;
padding: 80px 4% 60px;
}
.points-sec-inner{
max-width: 1000px;
margin: 0 auto;
}
.points-sec-text{
padding: 0 5% 40px;
border-bottom: 1px solid #999;
}
.points-cont-col2{
display: flex;
padding: 0 5%;
}
.points-cont-col2-left{
width: 50%;
padding: 0 3% 0 0;
flex-shrink: 0;
}
.points-cont-col2-right{
width: 50%;
padding: 0 0 0 3%;
flex-shrink: 0;
}
.points-third-sec .points-cont-col2-left{
width: 41%;
}
.points-third-sec .points-cont-col2-right{
width: 59%;
}
.points-sec-inner h3{
font-size: 21px;
margin: 0 0 10px;
}
.points-sec-inner .page-ttl-line{
margin: 0 0 20px;
}
.points-penta{
max-width: 500px;
margin: 0 auto;
}
.points-03-gr-box{
background: #fff;
padding: 50px 6% 30px;
border: 1px solid #999;
position: relative;
text-align: center;
}
.points-03-gr-box img{
width: 100%;
max-width: 688px;
}
.points-03-gr-ttl{
width: 148px;
height: 54px;
position: absolute;
left: 0;
top: -26px;
background: #93c9e1;
color: #fff;
font-size: 21px;
text-align: center;
line-height: 54px;
}
.points-03-gr-text{
text-align: left;
margin-bottom: -40px;
padding: 0 0 0 46%;
position: relative;
top: -40px;
}
.points-03-gr-text p{
text-align: right;
font-size: 12px;
}
.itv-dev{
font-size: 17px;
display: inline-block;
position: relative;
top: -6px;
}
.itv-main{
width: 100%;
max-width: 1400px;
margin: 0 auto;
padding: 30px 0 0;
overflow: hidden;
position: relative;
}
.itv-main::before,
.itv-main::after {
animation: 2s cubic-bezier(0.4, 0, 0.2, 1) forwards;
animation-delay: 0.5s;
background: #fff;
content: '';
pointer-events: none;
position: absolute;
z-index: 1;
}
.itv-main::before {
animation-name: img-wrap-before;
inset: 0 0 50%;
}
.itv-main::after {
animation-name: img-wrap-after;
inset: 50% 0 0;
}
@keyframes img-wrap-before {
100% {transform: translateX(100%);}
}
@keyframes img-wrap-after {
100% {
transform: translateX(-100%);}
}
.itv-prof{
width: 100%;
display: flex;
}
.itv-prof dt{
width: 116px;
font-size: 19px;
display: flex;
align-items: center;
border-right: 1px solid #231815;
flex-shrink: 0;
font-weight: 400;
}
.itv-prof dd{
flex-grow: 1;
padding: 0 0 0 40px;
}
.itv-sec-ttl{
width: 100%;
display: flex;
background: #93c9e1;
color: #fff;
font-weight: 400;
}
.itv-sec-ttl dt{
width: 162px;
font-size: 16px;
display: flex;
align-items: center;
justify-content: center;
border-right: 1px solid #fff;
flex-shrink: 0;
font-weight: 400;
}
.itv-sec-ttl dd{
flex-grow: 1;
padding: 22px 30px;
}
.itv-sec-ttl dd h2{
font-size: 22px;
letter-spacing: 0.1em;
font-weight: 500;
}
.itv-text{
padding: 0 4%;
}
.itv-img{
padding: 0 4% 20px;
}
.itv-msg{
background: #93c9e1;
padding: 24px;
border-radius: 24px;
}
.itv-msg dl{
display: flex;
color: #fff;
}
.itv-msg dl dt{
width: 162px;
font-size: 22px;
display: flex;
align-items: center;
justify-content: center;
border-right: 1px solid #fff;
flex-shrink: 0;
font-weight: 400;
}
.itv-msg dl dd{
flex-grow: 1;
padding: 14px 30px;
font-size: 17px;
letter-spacing: 0.1em;
font-weight: 500;
}
.itv-schedule-block{
background: #eeeeee;
width: 100%;
max-width: 1300px;
margin: 0 auto;
padding: 60px 4%;
}
.itv-schedule-ttl{
font-family: "Poppins", sans-serif;
font-weight: 400;
font-size: 16px;
text-align: center;
line-height: 1.6;
max-width: 1000px;
margin: 0 auto;
border-bottom: 1px solid #999;
padding: 0 0 20px;
}
.itv-schedule-ttl span{
font-size: 24px;
}
.itv-schedule-line-box{
overflow: hidden;
width: 100%;
max-width: 1000px;
margin: 0 auto;
}
.itv-schedule-line-left{
width: 47%;
float: left;
}
.itv-schedule-line-right{
width: 47%;
float: right;
}
.itv-schedule-line-left dl,
.itv-schedule-line-right dl{
display: flex;
}
.itv-schedule-line-left dl dt,
.itv-schedule-line-right dl dt{
width: 84px;
padding: 0 20px 36px 0;
border-right: 2px solid #93c9e1;
position: relative;
font-size: 21px;
font-weight: 500;
flex-shrink: 0;
text-align: right;
}
.itv-schedule-line-point{
width: 19px;
height: 19px;
position: absolute;
top: 10px;
left: 74px;
background: #93c9e1;
border-radius: 50%;
}
.itv-schedule-line-left dl dd,
.itv-schedule-line-right dl dd{
flex: 1;
padding: 2px 0 36px 28px;
line-height: 1.7;
}
.itv-schedule-act-ttl{
font-size: 21px;
font-weight: 500;
margin: 0 0 8px;
}
.itv-other-sec{
max-width: 1500px;
background: #eee;
margin: 0 auto;
padding: 90px 6% 140px;
}
.itv-other-sec-ttl{
width: 180px;
text-align: center;
font-size: 18px;
margin: 0 auto;
padding: 0 0 6px;
border-bottom: 3px solid #231815;
}
.itv-o-sliderArea {
max-width: 100%;
max-width: 1100px;
margin: 0 auto;
}
.itv-o-sliderArea .slick-list {
margin: 0 -16px;
}
.itv-o-sliderArea .slick-slide {
margin: 0 16px;
}
.itv-o-sliderArea .slick-slide img {
width: 100%;
height: auto;
}
.itv-o-sliderArea .slick-prev, .slick-next {
z-index: 1;
}
.itv-o-sliderArea .slick-prev:before, .slick-next:before {
color: #000;
}
.itv-o-sliderArea .slick-active {
opacity: 1;
}
.itv-o-sliderArea .slick-current {
opacity: 1;
}
.itv-other p{
text-align: center;
line-height: 1.7;
}
.itv-other p span{
font-size: 13px;
}
.cat-block{
max-width: 1400px;
margin: 0 auto;
}
.cat-block-ttl-box{
position: relative;
}
.cat-block-ttl{
height: 30px;
position: absolute;
top: 0;
bottom: 0;
left: 10%;
margin: auto;
}
.cat-block-ttl h2{
font-size: 30px;
color: #fff;
line-height: 1.6;
letter-spacing: 0.2em
}
.cat-block-ttl h2 span{
font-size: 21px;
}
.cat-cont-box{
background: #eee;
max-width: 1400px;
margin: 0 auto;
padding: 50px 0;
}
.cat-cont-ttl{
font-size: 21px;
}
.cat-point{
background: #93c9e1;
padding: 24px;
border-radius: 24px;
}
.cat-point dl{
display: flex;
color: #fff;
}
.cat-point dl dt{
width: 162px;
font-size: 19px;
display: flex;
align-items: center;
justify-content: center;
border-right: 1px solid #fff;
flex-shrink: 0;
font-weight: 600;
text-align: center;
line-height: 1.7;
}
.cat-point dl dd{
flex-grow: 1;
padding: 14px 30px;
letter-spacing: 0.1em;
}
.cat-link-box{
max-width: 340px;
margin: 0 auto;
text-align: center;
}
.cat-link-ttl{
font-size: 18px;
margin: 0 0 20px;
}
.cat-link-box a{
display: block;
}
.cat-link-img{
position: relative;
margin: 0 0 14px;
}
.cat-link-box a p{
line-height: 1.5;
}
.cat-link-box a p span{
font-size: 13px;
}
.cat-anchor-box,
.flow-anchor-box{
display: flex;
justify-content: space-between;
}
.cat-anchor-once{
width: 48%;
min-height: 80px;
}
.cat-anchor-once a,
.flow-anchor-once a{
width: 100%;
height: 100%;
display: table;
background: #93c9e1;
text-align: center;
position: relative;
}
.cat-anchor-once a::after{
position: absolute;
content: '';
width: 16px;
height: 14px;
bottom: -14px;
left: 50%;
margin-left: -8px;
background:url(../images/anchor-arrow.png) no-repeat center center;
background-size: 16px 14px;
}
.flow-anchor-once a::after{
position: absolute;
content: '';
width: 12px;
height: 10px;
bottom: -10px;
left: 50%;
margin-left: -6px;
background:url(../images/anchor-arrow.png) no-repeat center center;
background-size: 12px 10px;
}
.cat-anchor-once a p,
.flow-anchor-once a p{
display: table-cell;
vertical-align: middle;
color: #fff;
font-size: 22px;
}
.flow-anchor-once a p{
font-size: 18px;
}
.cat-anchor-once a p span{
font-size: 16px;
position: relative;
top: -2px;
}
.flow-anchor-once{
width: 22%;
min-height: 80px;
}
.flow-cont-ttl,
.points-sec-ttl,
.career-sec-ttl{
display: flex;
min-height: 70px;
background: #fff;
}
.flow-cont-ttl dt,
.points-sec-ttl dt,
.career-sec-ttl dt{
position: relative;
width: 134px;
display: flex;
align-items: center;
color: #fff;
justify-content: center;
flex-shrink: 0;
background: #93c9e1;
font-size: 16px;
font-weight: 400;
}
.career-sec-ttl dt{
line-height: 1.3;
font-weight: 400;
}
.flow-cont-ttl dt::after{
position: absolute;
content: '';
width: 12px;
height: 10px;
bottom: -10px;
left: 50%;
margin-left: -6px;
background:url(../images/anchor-arrow.png) no-repeat center center;
background-size: 12px 10px;
}
.flow-cont-ttl dd,
.points-sec-ttl dd,
.career-sec-ttl dd{
width: 134px;
display: flex;
align-items: center;
padding: 0 30px;
flex-grow: 1;
border-bottom: 1px solid#999;
border-top: 1px solid#999;
border-right: 1px solid#999;
}
.flow-cont-ttl dd h2,
.points-sec-ttl dd h2{
font-size: 23px;
}
.career-sec-ttl dd h2{
font-size: 21px;
}
.flow-cont{
margin: 0 0 4px;
padding: 50px 2% 120px;
}
.flow-inner-ttl{
font-size: 21px;
}
.flow-inner-text{
margin: 0 0 4px;
text-indent:-1.3em;
padding-left:1.3em;
}
.flow-inner-text span{
color: #93c9e1;
padding: 0 0.3em 0 0;
}
.flow-tag-box{
background: rgba(0,0,0,0.30);
margin: 20px 0 0;
padding: 8px 14px 8px 20px;
border-radius: 6px;
display: inline-block;
font-size: 14px;
}
.flow-tag-cat{
display: inline-block;
color: #fff;
line-height: 1.4;
margin: 0 14px 0 0;
padding: 0 14px 0 0;
border-right: 1px solid #fff;
}
.flow-tag-box a{
text-decoration: underline;
color: #ffff00;
margin: 0 8px;
}
.flow-tag-box-line{
width: 1px;
height: 18px;
background: #fff;
margin: 0 14px;
display: inline-block;
}
.process01{
background:url(../images/flow-process01.jpg) no-repeat center center;
background-size: cover;
}
.process02{
background:url(../images/flow-process02.jpg) no-repeat center center;
background-size: cover;
}
.process03{
background:url(../images/flow-process03.jpg) no-repeat center center;
background-size: cover;
}
.process04{
background:url(../images/flow-process04.jpg) no-repeat center center;
background-size: cover;
}
.faq-anchor-box{
}
.faq-anchor{
font-size: 19px;
font-weight: 600;
display: inline-block;
margin: 0 30px 0 0;
}
.faq-anchor img{
width: 26px;
vertical-align: middle;
margin: 0 12px 0 0;
}

.rec-h2-ttl{
font-size: 21px;
font-weight: 600;
padding: 0 0 12px;
}
.rec-line-base{
height: 2px;
background: #ccc;
position: relative;
}
.rec-line{
position: absolute;
left: 0;
top: 0;
width: 150px;
height: 2px;
background: #93c9e1;
}
dl.faq-q{
width: 100%;
display: flex;
margin: 0 0 12px;
}
.faq-q dt{
width: 50px;
font-weight: 600;
text-align: center;
color: #fff;
background: #93c9e1;
padding: 12px 2px 12px 6px;
flex-shrink: 0;
}
.faq-q dd{
font-weight: 600;
padding: 12px 20px;
flex-grow: 1;
background: #eee;
}
dl.faq-a{
width: 100%;
display: flex;
}
.faq-a dt{
width: 50px;
font-weight: 600;
text-align: center;
color: #93c9e1;
padding: 12px 2px 12px 6px;
flex-shrink: 0;
}
.faq-a dd{
padding: 12px 20px;
}
.faq-a dd span{
display: inline-block;
font-weight: 600;
}
.career-cont{
padding: 0 5%;
}
.career-path{
position: relative;
}
.career-path .flow-tag-box{
position: absolute;
top: 0;
left: 0;
margin: 10px 0 0;
}
.career-ed-cont{
padding: 30px 0;
border-bottom: 1px solid #93c9e1;
}
.career-ed-cont h3{
font-size: 19px;
margin: 0 0 10px;
}
.career-ed-cont .page-ttl-line{
margin: 0 0 16px;
}
.career-ed-cont.add-mgb60{
border-bottom: none;
}

.applist{
display: flex;
overflow: hidden;
border-bottom: 1px dashed #999;
padding: 0 5%;
}
.applist.add-mgb80{
border-bottom: none;
}
.applist-ttl{
width: 174px;
padding: 26px 0;
flex-shrink: 0;
}
.applist-cont{
width: 80%;
padding: 26px 0;
flex-grow: 1;
}
.applist-cont p.add-indent{
text-indent:-1em;
padding-left:1em;
}
.applist-cont p.add-spacer{
display: inline-block;
}
.applist span{
display: inline-block;
text-indent: 0;
}
.looking-box{
display: flex;
}
.looking-ttl{
width: 170px;
text-align: center;
font-size: 23px;
color: #fff;
flex-shrink: 0;
background: #93c9e1;
padding: 8px 0;
}
.looking-cont{
font-size: 16px;
flex-grow: 1;
background: #eee;
padding: 0 30px;
display: flex;
align-items: center;
}
.looking-like-box{
font-size: 23px;
color: #fff;
background: #93c9e1;
padding: 8px 30px;
}
.looking-img-box{
max-width: 700px;
margin: 0 auto;
}
.looking-to-entry{
font-size: 26px;
text-align: center;
color: #93c9e1;
}

.career-btn{
width: 430px;
padding: 10px 0 0;
}
.career-btn a{
display: block;
background: #93c9e1;
color: #fff;
text-align: center;
line-height: 82px;
font-size: 23px;
}
.career-news{
overflow: hidden;
}
.career-news dt{
float: left;
width: 120px;
}
.career-news dt{
float: left;
width: 120px;
color: #93c9e1;
}
.career-news dd{
padding: 0 0 0 120px;
}






.foot-msg-sec{
position: relative;
width: 100%;
max-width: 1500px;
height: 475px;
margin: 0 auto;
background:url(../images/foot-msg-bg.jpg) no-repeat center center;
background-size: cover;
display: flex;
align-items: center;
}
.foot-msg-cont{
position: absolute;
width: 100%;
height: 200px;
left: 0;
top: 0;
bottom: 0;
margin: auto;
color: #fff;
text-align: center;
}
.foot-msg{
font-size: 36px;
line-height: 1.5;
}
.foot-sub-ttl{
font-size: 16px;
margin: 0 0 40px;
}
.foot-entry{
width: 190px;
height: 52px;
margin: 0 auto;
position: relative;
}
.foot-entry a{
display: block;
text-align: center;
line-height: 52px;
color: #fff;
font-size: 18px;
}
.foot-sub-ttl{
font-size: 16px;
}
.page-top{
position: fixed;
width: 52px;
height: 52px;
bottom: 134px;
right: 5%;
border-radius: 50%;
border: 1px solid #fff;
cursor: pointer;
display: none;
z-index: 11;
}
.footer{
padding: 50px 0 80px;
position: relative;
}
.footer-logo-box{
width: 180px;
position: absolute;
left: 0;
top: 50px;
}
.footer-links-cont{
text-align: center;
}
.footer-links-cont a{
margin: 0 14px;
font-size: 14px;
}
.footer-copyright{
font-size: 12px;
width: 180px;
position: absolute;
right: 0;
top: 52px;
}











/* =============================ADD============================= */
.add-mgb140{margin-bottom: 140px;}
.add-mgb120{margin-bottom: 120px;}
.add-mgb100{margin-bottom: 100px;}
.add-mgb80{margin-bottom: 80px;}
.add-mgb60{margin-bottom: 60px;}
.add-mgb50{margin-bottom: 50px;}
.add-mgb40{margin-bottom: 40px;}
.add-mgb30{margin-bottom: 30px;}
.add-mgb20{margin-bottom: 20px;}
.add-mgb10{margin-bottom: 10px;}
.add-mgauto{margin-left: auto;margin-right: auto;}



.animatedModal-off{
overflow:hidden;
}
.animatedModal-on{
overflow:scroll;
}
@keyframes scroll-hint-appear {
0% {
transform: translateX(40px);
opacity: 0;
}
10% {
opacity: 1;
}
50%,
100% {
transform: translateX(-40px);
opacity: 0;
}
}
.scroll-hint.is-right-scrollable {
background: linear-gradient(270deg, rgba(0, 0, 0, .15) 0, rgba(0, 0, 0, 0) 16px, rgba(0, 0, 0, 0));
}
.scroll-hint.is-right-scrollable.is-left-scrollable {
background: linear-gradient(90deg, rgba(0, 0, 0, .15) 0, rgba(0, 0, 0, 0) 16px, rgba(0, 0, 0, 0)), linear-gradient(270deg, rgba(0, 0, 0, .15) 0, rgba(0, 0, 0, 0) 16px, rgba(0, 0, 0, 0));
}
.scroll-hint.is-left-scrollable {
background: linear-gradient(90deg, rgba(0, 0, 0, .15) 0, rgba(0, 0, 0, 0) 16px, rgba(0, 0, 0, 0));
}
.scroll-hint-icon {
position: absolute;
top: 20px;
left: 5%;
box-sizing: border-box;
width: 100px;
height: 74px;
border-radius: 10px;
transition: opacity .3s;
opacity: 0;
background: rgba(66, 218, 170, 1);
text-align: center;
padding: 16px 4px 20px 4px;
}
.scroll-hint-icon-wrap {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
max-height: 100%;
pointer-events: none;
}
.scroll-hint-text {
font-size: 10px;
color: #FFF;
margin-top: 6px;
letter-spacing: 0;
}
.scroll-hint-icon-wrap.is-active .scroll-hint-icon {
opacity: .9;
}
.scroll-hint-icon:before {
display: inline-block;
width: 24px;
height: 28px;
color: #FFF;
vertical-align: middle;
text-align: center;
content: "";
background-position: center center;
background-repeat: no-repeat;
background-image:url(../images/finger-scroll.png);
background-size:100% auto; 
}
.scroll-hint-icon-wrap.is-active .scroll-hint-icon:after {
opacity: 1;
}
.scroll-hint-icon-wrap.is-active .scroll-hint-icon:before {
animation: scroll-hint-appear 1.8s linear;
animation-iteration-count: 2;
}
.scroll-hint-icon-white {
background-color: #FFF;
box-shadow: 0 4px 5px rgba(0, 0, 0, .4);
}

@media print {
body {width:1100px;}
}