@charset "UTF-8";
/* CSS Document */

@keyframes txtloop {
0% {
transform: translateX(100%);
}
to {
transform: translateX(-100%);
}
}

@keyframes txtloop2 {
0% {
transform: translateX(0);
}
to {
transform: translateX(-200%);
}
}


@keyframes zoomUp {
0% {
transform: scale(1.1);
}
100% {
transform: scale(1.4);
}
}

@keyframes zoomUp2 {
0% {
transform: scale(1);
}
100% {
transform: scale(1.2);
}
}


@-webkit-keyframes mv04-circle {
100% {
stroke-dashoffset: 0;
}
}

@keyframes mv04-circle {
100% {
stroke-dashoffset: 0;
}
}

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

@keyframes scrollLine {
0% {
transform: scaleY(0);
transform-origin: top;
}
45% {
transform: scaleY(1);
transform-origin: top;
}
55% {
transform: scaleY(1);
transform-origin: bottom;
}
100% {
transform: scaleY(0);
transform-origin: bottom;
}
}


/*PC*/
@media print, screen and (min-width: 768px) {

/* mv
--------------------------------------------*/
#mv {
width: 100%;
height: 100vh;
min-height: 640px;
box-sizing: border-box;
position: relative;
overflow: hidden;
margin: 0 0 60px;
}

#mv .mv_slider {
opacity: 0;
transition: 0.4s ease;
height: 100%;
position: relative;
z-index: 1;
}
#mv .mv_slider.slick-initialized {
opacity: 1;
}

#mv .mv_slider .slick-list,
#mv .mv_slider .slick-track {
height: 100%;
}

#mv .mv_slider .slick-slide {
overflow: hidden;
}

#mv .mv_slider .slide {
height: 100vh;
min-height: 640px;
width: 100%;
position: relative;
overflow: hidden;
}
#mv .mv_slider .slide::after {
content: "";
display: block;
width: 100%;
height: 100%;
background: linear-gradient(to top, rgba(10, 25, 45, 0.55), rgba(10, 25, 45, 0.1) 55%, rgba(10, 25, 45, 0.15));
position: absolute;
bottom: 0;
left: 0;
z-index: 2;
}
#mv .mv_slider .slide img {
width: 100%;
height: 100%;
object-fit: cover;
}

/* Ken Burns（表示中のスライドがゆっくりズーム） */
#mv .slick-slide.add-animation img {
animation: zoomUp2 8s linear 0s normal both;
}

#mv .copy {
position: absolute;
left: 5%;
bottom: 16%;
z-index: 20;
padding: 0;
}

#mv .copy::before {
content: "";
display: block;
width: 64px;
height: 4px;
background: linear-gradient(90deg, #00488a, #087fba);
margin-bottom: 32px;
}

#mv .copy h1{
letter-spacing: .04em;
font-size: 3.6rem;
font-weight: 800;
color: #FFF;
line-height: 1.35;
text-shadow:1px 2px 12px rgba(0,0,0,.35);
margin-bottom: 25px;
}

#mv .copy .txt{
font-weight: 800;
color: #FFF;
margin: 0 0 40px;
text-shadow:1px 1px 8px rgba(0,0,0,.35);
}

#mv .copy .en_txt{
font-size:.9rem;
font-weight: 300;
color: #FFF;
line-height: 1.6;
text-shadow:1px 1px 8px rgba(0,0,0,.35);
}

/* ページネーション（ライン型ドット） */
#mv .slick-dots {
position: absolute;
right: 50px;
bottom: 50px;
left: auto;
width: auto;
z-index: 1001;
display: flex;
gap: 12px;
}

#mv .slick-dots li {
width: 44px;
height: 3px;
margin: 0;
}

#mv .slick-dots li button {
width: 100%;
height: 3px;
padding: 0;
font-size: 0;
border: none;
background: rgba(255,255,255,.35);
transition: background .5s ease;
}

#mv .slick-dots li button:before {
content: none;
}

#mv .slick-dots li.slick-active button {
background: #FFF;
}

/* スクロールインジケーター */
#mv .mv_scroll {
position: absolute;
right: 60px;
bottom: 110px;
z-index: 30;
color: #FFF;
font-size: .7rem;
letter-spacing: .25em;
writing-mode: vertical-rl;
padding-bottom: 70px;
}

#mv .mv_scroll::after {
content: "";
position: absolute;
left: 50%;
bottom: 0;
width: 1px;
height: 56px;
background: #FFF;
animation: scrollLine 2.2s ease infinite;
}


/* service
--------------------------------------------*/
#service{
position: relative;
margin: 0 auto 120px;
padding:0 0 6%;
box-sizing: border-box;
/* 見出し部分だけ白地、そこから下を薄い青地にする */
background: linear-gradient(to bottom, #FFF 0, #FFF 90px, #f2f5fc 90px);
}

#service .section_wrap{
width: 88%;
margin: 0 auto 100px;
position: relative;
}

#service .list{
width: 88%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: stretch;
margin: auto;
}

#service .list li{
width: 49%;
margin-bottom:2%;
background: #FFF;
position: relative;
display: flex;
box-shadow: 0 2px 14px rgba(0,72,138,.06);
}

#service .list a{
width: 100%;
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
flex-direction: row-reverse;
box-sizing: border-box;
}

#service .list a .txt_box{
width:60%;
padding: 5%;
box-sizing: border-box;
}

#service .list a .txt_box h4{
font-size:1.8rem;
line-height: 1;
margin: 0 0 20px;
}

#service .list a .txt_box h4 span{
display: block;
font-size: .6rem;
color: #00488a;
margin: 0 0 8px 2px;
}

#service .list a .txt_box p{
font-size: .9rem;
line-height: 1.8;
}

#service .list a .txt_box .button2{
width:160px;
height:40px;
border:2px solid #00488a;
text-align:center;
cursor:pointer;
position:relative;
box-sizing:border-box;
overflow:hidden;
margin:20px 0 0 auto;
}

#service .list a .txt_box .button2 p{
font-size:.9rem;
font-weight: 600;
color:#00488a;
text-decoration:none;
line-height:40px;
transition:all .5s ease;
z-index:2;
position:relative;
display: block !important;
}

#service .list a .txt_box .button2 .eff{
width:100%;
height:40px;
border:0px solid #00488a;
position:absolute;
transition:all .5s ease;
z-index:1;
box-sizing:border-box;
}

#service .list a .txt_box .button2:hover .eff{
border:50px solid #00488a;
}
#service .list a .txt_box .button2:hover p{
color:#fff;
}

#service .list a .img{
width: 40%;
flex-shrink: 0;
}

#service .list a .img.bg1{
background:url("../images/index/b_bg01.jpg") center center no-repeat;
background-size: cover;
}

#service .list a .img.bg2{
background:url("../images/index/b_bg02.jpg") center center no-repeat;
background-size: cover;
}

#service .list a .img.bg3{
background:url("../images/index/b_bg03.jpg") center center no-repeat;
background-size: cover;
}

#service .list a .img.bg4{
background:url("../images/index/b_bg04.jpg") center center no-repeat;
background-size: cover;
}

#service .list a .img.bg5{
background:url("../images/index/b_04.jpg") center center no-repeat;
background-size: cover;
}


/* csr
--------------------------------------------*/
#csr {
background: url("../images/index/bg_csr_img.jpg") no-repeat center/cover;
padding:7rem 5rem;
width: 100%;
overflow: hidden;
box-sizing: border-box;
position: relative;
margin: 0 auto;
}

#csr .section_wrap{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
flex-direction: row-reverse;
}

#csr .section_wrap .txt{
width: 50%;
}

#csr .ttl{
color:#FFF !important;
}

#csr .en_ttl{
color:#FFF !important;
margin-bottom: 60px;
}

#csr .section_wrap .s_ttl{
font-size: 2rem;
font-weight: 800;
line-height: 1.6;
margin: 0 0 30px;
position: relative;
color: #FFF;
}

#csr .section_wrap .txt .read_txt{
font-size: 1rem;
font-weight: 600;
line-height: 2.4;
color: #FFF;
margin: 0 0 80px;
}

#csr .button{
width:260px;
height:50px;
border:2px solid #fff;
text-align:center;
cursor:pointer;
position:relative;
box-sizing:border-box;
overflow:hidden;
margin:0 auto;
}

#csr .button a{
font-size:1.2rem;
color:#fff;
text-decoration:none;
line-height:50px;
transition:all .5s ease;
z-index:2;
position:relative;
}

#csr .eff{
width:100%;
height:50px;
border:0px solid #00488a;
position:absolute;
transition:all .5s ease;
z-index:1;
box-sizing:border-box;
}

#csr .button:hover .eff{
border:70px solid #00488a;
}

#csr .button:hover a{
color:#FFF;
}


/* recruit
--------------------------------------------*/
#recruit{
position: relative;
overflow: hidden;
background: url("../images/index/recruit_bg.jpg") center center no-repeat;
background-size: cover;
width: 100%;
padding: 7rem 0;
box-sizing: border-box;
overflow: hidden;
}

#recruit::before{
content: "";
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0,.25);
}

#recruit .section_wrap{
width: 90%;
margin: 0 auto;
position: relative;
}

#recruit .section_wrap .txt_box{
width: 100%;
margin: 0;
}

#recruit .ttl{
color:#FFF !important;
text-align: center;
text-shadow: 1px 1px 6px rgba(0,0,0,.25);
}

#recruit .en_ttl{
color:#FFF !important;
margin-bottom: 60px;
text-align: center;
text-shadow: 1px 1px 6px rgba(0,0,0,.25);
}

#recruit .section_wrap .s_ttl{
font-size: 2.2rem;
font-weight: 800;
line-height: 1.6;
margin: 0 0 60px;
position: relative;
color: #FFF;
text-align: center;
text-shadow: 1px 1px 6px rgba(0,0,0,.25);
}

#recruit .read_txt{
color: #FFF;
font-weight: 500;
margin-bottom: 60px;
}

#recruit .button{
width:260px;
height:50px;
border:2px solid #fff;
text-align:center;
cursor:pointer;
position:relative;
box-sizing:border-box;
overflow:hidden;
margin:0 auto;
}

#recruit .button a{
font-size:1.2rem;
color:#fff;
text-decoration:none;
line-height:50px;
transition:all .5s ease;
z-index:2;
position:relative;
}

#recruit .eff{
width:100%;
height:50px;
border:0px solid #00488a;
position:absolute;
transition:all .5s ease;
z-index:1;
box-sizing:border-box;
}

#recruit .button:hover .eff{
border:70px solid #00488a;
}

#recruit .button:hover a{
color:#FFF;
}

/* news
--------------------------------------------*/
#news{
width:calc(100% - 20rem);
position: relative;
margin:0 auto 120px;
min-width: 1300px;
}

#news .section_wrap{
position: relative;
margin:0 auto;
background:rgba(74,80,95,.1);
padding: 5rem 4rem;
box-sizing: border-box;
border-radius: 2rem;
}

#news .section_wrap .en_ttl{
margin-bottom: 30px;
font-size: 2.4rem;
}

#news .news_wrap{
width: 100%;
margin:0 auto 40px;
}

#news .news_wrapp dl{
line-height: 1.4;
margin: 0 0 10px;
background: #FFF;
}

#news .news_wrap dl:last-child{
margin-bottom: 0;
}

#news .news_wrap dl dt{
position: relative;
width:100%;
font-size: 1rem;
font-weight:600;
padding:0 5px;
}

#news .section_wrap dl dd{
position: relative;
width:100%;
border-bottom: 1px solid rgba(0,0,0,.05);
padding:5px;
box-sizing: border-box;
transition: .5s;
display:flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
margin-bottom: 10px;
}

#news .section_wrap dl dd:hover{
background:rgba(255,255,255,.6);
transition: .5s;
}

#news .section_wrap dl dd a{
width:calc(100% - 35px);
font-weight: 700;
}

#news .section_wrap dl dd p{
width:26px;
}

#news .button{
width: 200px;
margin: 40px 0 0 auto;
}


/*contact
---------------------------------------------*/
#contact{
background:url("../images/index/contact_bg.jpg") 0 0 repeat;
padding:7rem 5rem 11rem;
box-sizing: border-box;
overflow: hidden;
}

#contact .ttl{
color:#FFF !important;
text-shadow: 1px 1px 6px rgba(0,0,0,.25);
}

#contact .en_ttl{
color:#FFF !important;
margin-bottom: 60px;
text-shadow: 1px 1px 6px rgba(0,0,0,.25);
}

#contact .s_ttl{
color:#FFF !important;
font-size: 2rem;
margin-bottom: 30px;
text-shadow: 1px 1px 6px rgba(0,0,0,.25);
}

#contact .txt{
color: #FFF;
margin: 0 0 60px;
}

#contact .button{
width:260px;
height:50px;
border:2px solid #fff;
text-align:center;
cursor:pointer;
position:relative;
box-sizing:border-box;
overflow:hidden;
margin:0 0;
}

#contact .button a{
font-size:1.2rem;
color:#fff;
text-decoration:none;
line-height:50px;
transition:all .5s ease;
z-index:2;
position:relative;
}

#contact .eff{
width:100%;
height:50px;
border:0px solid #00488a;
position:absolute;
transition:all .5s ease;
z-index:1;
box-sizing:border-box;
}

#contact .button:hover .eff{
border:70px solid #00488a;
}

#contact .button:hover a{
color:#FFF;
}


}
/*sp*/
@media only screen and (max-width: 767px) {
/* mv
--------------------------------------------*/
#mv {
width: 100%;
height: 100vh;
height: 100svh;
min-height: 560px;
margin-bottom:30px;
position: relative;
box-sizing: border-box;
overflow: hidden;
}

#mv .mv_slider {
opacity: 0;
transition: 0.4s ease;
height: 100%;
position: relative;
z-index: 1;
}

#mv .mv_slider.slick-initialized {
opacity: 1;
}

#mv .mv_slider .slick-list,
#mv .mv_slider .slick-track {
height: 100%;
}

#mv .mv_slider .slick-slide {
overflow: hidden;
}

#mv .mv_slider .slide {
width: 100%;
height: 100vh;
height: 100svh;
min-height: 560px;
position: relative;
overflow: hidden;
}

#mv .mv_slider .slide::after {
content: "";
display: block;
width: 100%;
height: 100%;
background: linear-gradient(to top, rgba(10, 25, 45, 0.6), rgba(10, 25, 45, 0.1) 55%, rgba(10, 25, 45, 0.2));
position: absolute;
bottom: 0;
left: 0;
z-index: 2;
}

#mv .mv_slider .slick-slide img {
width: 100%;
height: 100%;
object-fit: cover;
}

/* Ken Burns（表示中のスライドがゆっくりズーム） */
#mv .slick-slide.add-animation img {
animation: zoomUp2 8s linear 0s normal both;
}

#mv .copy {
position: absolute;
left: 5%;
right: 5%;
bottom: 14%;
z-index: 20;
padding: 0;
box-sizing: border-box;
}

#mv .copy::before {
content: "";
display: block;
width: 44px;
height: 3px;
background: linear-gradient(90deg, #00488a, #087fba);
margin-bottom: 18px;
}

#mv .copy h1{
letter-spacing: .04em;
font-size:1.5rem;
font-weight: 800;
color: #FFF;
line-height: 1.4;
margin-bottom: 12px;
text-shadow:1px 1px 8px rgba(0,0,0,.4);
}

#mv .copy .txt{
font-size: .8rem;
font-weight: 800;
color: #FFF;
margin: 0 0 20px;
text-shadow:1px 1px 6px rgba(0,0,0,.4);
}

#mv .copy .en_txt{
font-size:.7rem;
font-weight: 300;
color: #FFF;
line-height: 1.4;
text-shadow:1px 1px 6px rgba(0,0,0,.4);
}

/* ページネーション（ライン型ドット） */
#mv .slick-dots {
position: absolute;
right: 5%;
bottom: 24px;
left: auto;
width: auto;
z-index: 1001;
display: flex;
gap: 8px;
}

#mv .slick-dots li {
width: 28px;
height: 3px;
margin: 0;
}

#mv .slick-dots li button {
width: 100%;
height: 3px;
padding: 0;
font-size: 0;
border: none;
background: rgba(255,255,255,.35);
transition: background .5s ease;
}

#mv .slick-dots li button:before {
content: none;
}

#mv .slick-dots li.slick-active button {
background: #FFF;
}

/* スクロールインジケーター（SPでは非表示） */
#mv .mv_scroll {
display: none;
}


/* service
--------------------------------------------*/
#service{
position: relative;
margin: 0 auto;
padding:0 0 10%;
box-sizing: border-box;
/* 見出し部分だけ白地、そこから下を薄い青地にする */
background: linear-gradient(to bottom, #FFF 0, #FFF 60px, #f2f5fc 60px);
overflow: hidden;
}

#service .section_wrap{
width: 90%;
margin: 0 auto 40px;
position: relative;
}

#service .list{
width: 100%;
margin: auto;
}

#service .list li{
width:100%;
margin-bottom:4%;
background: #FFF;
position: relative;
box-shadow: 0 2px 10px rgba(0,72,138,.06);
}

#service .list a{
display: block;
}

#service .list a .txt_box{
width:100%;
padding:8%;
box-sizing: border-box;
}

#service .list a .txt_box h4{
font-size:1.4rem;
line-height: 1;
margin: 0 0 10px;
}

#service .list a .txt_box h4 span{
display: block;
font-size: .6rem;
color: #00488a;
margin: 0 0 8px 2px;
}

#service .list a .txt_box p{
font-size: .9rem;
line-height: 1.8;
}

#service .list a .txt_box .button2{
width:160px;
height:40px;
border:2px solid #00488a;
text-align:center;
cursor:pointer;
position:relative;
box-sizing:border-box;
overflow:hidden;
margin:20px auto 0;
}

#service .list a .txt_box .button2 p{
font-size:.9rem;
font-weight: 600;
color:#00488a;
text-decoration:none;
line-height:40px;
transition:all .5s ease;
z-index:2;
position:relative;
display: block !important;
}

#service .list a .txt_box .button2 .eff{
width:100%;
height:40px;
border:0px solid #00488a;
position:absolute;
transition:all .5s ease;
z-index:1;
box-sizing:border-box;
}

#service .list a .txt_box .button2:hover .eff{
border:50px solid #00488a;
}
#service .list a .txt_box .button2:hover p{
color:#fff;
}

#service .list a .img{
width: 100%;
height: 240px;
}

#service .list a .img.bg1{
background:url("../images/index/b_bg01.jpg") center center no-repeat;
background-size: cover;
}

#service .list a .img.bg2{
background:url("../images/index/b_bg02.jpg") center center no-repeat;
background-size: cover;
}

#service .list a .img.bg3{
background:url("../images/index/b_bg03.jpg") center center no-repeat;
background-size: cover;
}

#service .list a .img.bg4{
background:url("../images/index/b_bg04.jpg") center center no-repeat;
background-size: cover;
}

#service .list a .img.bg5{
background:url("../images/index/b_04.jpg") center center no-repeat;
background-size: cover;
}


/* csr
--------------------------------------------*/
#csr {
background: url("../images/index/bg_csr_imgsp.jpg") no-repeat left/cover;
padding:15% 5%;
width: 100%;
overflow: hidden;
box-sizing: border-box;
position: relative;
margin: 0 auto;
}

#csr .section_wrap{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
flex-direction: row-reverse;
}

#csr .section_wrap .txt{
width:100%;
}

#csr .ttl{
color:#FFF !important;
}

#csr .en_ttl{
color:#FFF !important;
margin-bottom:30px;
}

#csr .section_wrap .s_ttl{
font-size: 1.2rem;
font-weight: 800;
line-height: 1.6;
margin: 0 0 20px;
position: relative;
color: #FFF;
}

#csr .section_wrap .txt .read_txt{
font-size: .8rem;
font-weight: 600;
line-height:2;
color: #FFF;
margin: 0 0 30px;
}

#csr .button{
width:260px;
height:50px;
border:2px solid #fff;
text-align:center;
cursor:pointer;
position:relative;
box-sizing:border-box;
overflow:hidden;
margin:0 auto;
}

#csr .button a{
font-size:1.2rem;
color:#fff;
text-decoration:none;
line-height:50px;
transition:all .5s ease;
z-index:2;
position:relative;
}

#csr .eff{
width:100%;
height:50px;
border:0px solid #00488a;
position:absolute;
transition:all .5s ease;
z-index:1;
box-sizing:border-box;
}

#csr .button:hover .eff{
border:70px solid #00488a;
}

#csr .button:hover a{
color:#FFF;
}


/* recruit
--------------------------------------------*/
#recruit{
position: relative;
overflow: hidden;
background: url("../images/index/recruit_bgsp.jpg") center center no-repeat;
background-size: cover;
padding:15% 5%;
width: 100%;
box-sizing: border-box;
}

#recruit::before{
content: "";
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0,.25);
}

#recruit .section_wrap{
width: 90%;
margin: 0 auto;
position: relative;
}

#recruit .section_wrap .txt_box{
width: 100%;
margin: 0;
}

#recruit .ttl{
color:#FFF !important;
text-align: center;
text-shadow: 1px 1px 6px rgba(0,0,0,.25);
}

#recruit .en_ttl{
color:#FFF !important;
margin-bottom: 60px;
text-align: center;
text-shadow: 1px 1px 6px rgba(0,0,0,.25);
}

#recruit .section_wrap .s_ttl{
font-size: 1.2rem;
font-weight: 800;
line-height: 1.6;
margin: 0 0 60px;
position: relative;
color: #FFF;
text-align: center;
text-shadow: 1px 1px 6px rgba(0,0,0,.25);
}

#recruit .read_txt{
color: #FFF;
font-weight: 500;
margin-bottom: 60px;
}

#recruit .button{
width:260px;
height:50px;
border:2px solid #fff;
text-align:center;
cursor:pointer;
position:relative;
box-sizing:border-box;
overflow:hidden;
margin:0 auto;
}

#recruit .button a{
font-size:1.2rem;
color:#fff;
text-decoration:none;
line-height:50px;
transition:all .5s ease;
z-index:2;
position:relative;
}

#recruit .eff{
width:100%;
height:50px;
border:0px solid #00488a;
position:absolute;
transition:all .5s ease;
z-index:1;
box-sizing:border-box;
}

#recruit .button:hover .eff{
border:70px solid #00488a;
}

#recruit .button:hover a{
color:#FFF;
}


/* news
--------------------------------------------*/
#news{
width:calc(100% - 10%);
position: relative;
margin:0 auto 60px;
overflow: hidden;

}

#news .section_wrap{
position: relative;
margin:0 auto;
background:rgba(74,80,95,.05);
padding: 8% 5%;
box-sizing: border-box;
border-radius:1rem;
}

#news .section_wrap .en_ttl{
margin-bottom: 30px;
font-size: 2.4rem;
}

#news .news_wrap{
width: 100%;
margin:0 auto;
}

#news .news_wrapp dl{
line-height: 1.4;
margin: 0 0 10px;
background: #FFF;
}

#news .news_wrap dl:last-child{
margin-bottom: 0;
}

#news .news_wrap dl dt{
position: relative;
width:100%;
font-size: .9rem;
font-weight:600;
padding:0 5px;
}

#news .section_wrap dl dd{
position: relative;
width:100%;
border-bottom: 1px solid rgba(0,0,0,.1);
padding:5px;
box-sizing: border-box;
transition: .5s;
display:flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
margin-bottom: 10px;
font-size: .8rem;
}

#news .section_wrap dl dd:hover{
background:rgba(255,255,255,.6);
transition: .5s;
}

#news .section_wrap dl dd a{
width:calc(100% - 25px);
font-weight: 700;
}

#news .section_wrap dl dd p{
width:15px;
}

#news .button{
width: 200px;
margin: 40px auto 0;
}


/*contact
---------------------------------------------*/
#contact{
background:url("../images/index/contact_bg.jpg") 0 0 repeat;
padding:15% 5%;
width: 100%;
box-sizing: border-box;
overflow: hidden;
}

#contact .ttl{
color:#FFF !important;
text-shadow: 1px 1px 6px rgba(0,0,0,.25);
}

#contact .en_ttl{
color:#FFF !important;
margin-bottom: 30px;
text-shadow: 1px 1px 6px rgba(0,0,0,.25);
}

#contact .s_ttl{
color:#FFF !important;
font-size: 1rem;
margin-bottom:30px;
text-shadow: 1px 1px 6px rgba(0,0,0,.25);
}

#contact .txt{
font-size: .8rem;
color: #FFF;
margin: 0 0 30px;
}

#contact .button{
width:260px;
height:50px;
border:2px solid #fff;
text-align:center;
cursor:pointer;
position:relative;
box-sizing:border-box;
overflow:hidden;
margin:0 auto;
}

#contact .button a{
font-size:1.2rem;
color:#fff;
text-decoration:none;
line-height:50px;
transition:all .5s ease;
z-index:2;
position:relative;
}

#contact .eff{
width:100%;
height:50px;
border:0px solid #00488a;
position:absolute;
transition:all .5s ease;
z-index:1;
box-sizing:border-box;
}

#contact .button:hover .eff{
border:70px solid #00488a;
}

#contact .button:hover a{
color:#FFF;
}


}