﻿@import url('https://fonts.googleapis.com/css2?family=Sawarabi+Gothic&display=swap');
@import url('https://fonts.googleapis.com/css2?family=La+Belle+Aurore&display=swap');
body {
font-family: 'Sawarabi Gothic', sans-serif;
}
.banner_wrap {
z-index: 1;position: relative}
.banner_wrap a {background-color: #005eff}
#main_right header {
    padding-right: 0px;
}

.cate_list li {
    border-color: #ffffff!important;
}

#contents .box_txt, #contents2 .box_txt {position: relative}
#contents .box_txt:before, #contents2 .box_txt:before {
    position: absolute;
    content: "";
    display: block;
    width: 149px;
    height: 200px;
    background-image: url(Dup/nayami.png);
    background-repeat: no-repeat;
    background-size: contain;
    right: 40px;
    bottom: -102px;
}
#contents2 .box_txt:before {
    background-image: url(Dup/car.png);
    right: -118px;
    bottom: -241px;
    width: 134%;
    height: 80px;
    -webkit-animation: bgroop 15s linear infinite;
    animation: bgroop 15s linear infinite;
    background-size: 320px auto;
}

@-webkit-keyframes bgroop {
    from {
        background-position: right -320px  top 0;
    }
    to {
        background-position:-320px 0;
    }
}
@keyframes bgroop {
    from {
        background-position: right -320px top 0;
    }
    to {
        background-position:-320px 0 ;
    }
}







#footer_txt .tel:hover {
transform: translateY(-5px);
}
.tel_comment {
font-size: 16px;
    padding-bottom: 9px;
    color: #626262;
    text-shadow: none;
    font-weight: bold;
}
#pc_intro figure:before {
    font-family: 'La Belle Aurore', cursive;
    content: "Over Whelm";
    display: block;
    position: absolute;
    left: 7px;
    z-index: 1;
    font-size: 90px;
    color: #fff;
    bottom: -21px;
}


#page_title {
    padding-top: 17px;z-index: 1;
    position: relative;
background-color: rgba(34, 116, 255, 0.84)!important;
}

.animWrap {
  overflow: hidden;
display: inline-block;/*横幅いっぱいだと通り過ぎたやつがはみ出ないから*/
}
.animInner {
	width: inherit;
  height: inherit;
  text-align: center;
  opacity: 0;
border-bottom: 1px solid #fff;
    padding-bottom: 6px;
}
.isPlay {
    animation-name: play;
    animation-duration: .5s;
    animation-fill-mode: forwards;
    animation-timing-function: cubic-bezier(.8,0,.5,1);
    position: relative;
    opacity: 1 !important;
}
.isPlay:before {
    animation-name: maskOut;
    animation-duration: .5s;
    animation-delay: .5s;
    animation-fill-mode: forwards;
    animation-timing-function: cubic-bezier(.8,0,.5,1);
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    z-index: 50;
    width: 100%;
    height: 106%;
    background-color: #f4a01b;
}
@keyframes play {
  from {
    transform: translateX(-100%);
  }
  
  to {
    transform: translateX(0);
  }
}

@keyframes maskOut {
  from {
    transform: translateX(0);
  }
  
  to {
    transform: translateX(100%);
  }
}








#pc_intro figure {position: relative;}
#pc_intro h2 {
    font-size: 1.5rem;
    font-weight: bold;
}





#page_title figure {margin-bottom: 0}
#page_title h2 span {
text-shadow: none}

img.shadow-l {
box-shadow: 0 6px 25px rgba(31, 40, 51, 0.15);
}
#pc_intro div.shadow-l {
background-color: transparent;
box-shadow: none;
}
#footer_txt .tel {
background:#FF5F17;
    display: inline-block;
    padding: 4px 16px;
    border-radius: 26px;
transition : all 0.3s
}
#pc_tel .fs_wrap a {
    background: #fff;
    padding: 7px 19px 7px 37px;
    border-radius: 12px;
    position: relative;
    color: #5d99ff;
    font-weight: bold;
    text-shadow: none;
    box-shadow: 0px 5px 16px -6px rgba(63, 139, 204, 0.18);
}
#pc_tel img {
    background: #5d99ff;
    border-radius: 32px;
    position: absolute;
    left: -41px;
    top: 50%;
    margin-top: -34px;
padding: 3px;
}
#left_bar #scroll, #top_return.retop {
z-index: 1;
}
.links_bt {
    position: relative;
width:  196px!important;
}
.links_bt:before {
content: "";
    display: block;
    position: absolute;
    top: 0;
    left: -128px;
    width: 159px;
    height: 111px;
    background-image: url(Dup/touch_aka.png);
    background-repeat: no-repeat;
    background-size: contain;
    z-index: 1;
}
div:hover .target {
	transform: rotateZ( 90deg ) ;
}
	.links_bt {
			transition: .5s ;
			transform: rotateZ( 0deg ) ;
		}
.links_bt img {
	transition: .5s ;
			transform: rotateZ( 6deg ) ;
}
.links_bt:hover img {
			transform: rotateZ( 366deg ) ;
		}
/* ------------------------------------------------------------------------*/
#menu_bt {
z-index: 3;
}
#main_right, #pc_intro {
position: relative
}
#main_right:before {
position: absolute;
    z-index: 0;
    top: -27.5%;
    left: 0;
    width: 100%;
    background: rgba(80, 145, 255, 0.74);
    transform-origin: 0 100%;
    content: "";
    height: 36%;
    transform: skewY( 
341deg
 );
    box-sizing: inherit;
}
#main_right:after {
position: absolute;
    z-index: 0;
    top: -36%;
    left: 0;
    width: 100%;
    background: rgba(80, 145, 255, 0.63);
    transform-origin: 0 100%;
    content: "";
    height: 36%;
    transform: skewY( 
18deg
 );
    box-sizing: inherit;
}
#pc_intro:before {
position: absolute;
    z-index: 0;
    top: 61.5%;
    left: 0;
    width: 100%;
    background: rgba(255, 255, 255, 0.72);
    transform-origin: 0 100%;
    content: "";
    height: 49%;
    transform: skewY( 
341deg
 );
    box-sizing: inherit;
}

header, main {
position: relative;
z-index: 1;
}
/* ------------------------------------------------------------------------*/
#contents h3 span, #contents2 h3 span {
font-weight: bold;
text-shadow: none;
}
/* ------------------------------------------------------------------------*/
#main_left, #main_right, #wrap, #main_right header, #pc_intro, #contents, #pc_news, #map, #sp_info, #contents2 {
    border: none!important;
}
.bg_color1 {
background-color: #5D99FF/*全体・SNSリンク背景*/
}
.bg_color2 {background-color: #fff;}
.bg_color3 {background-color: /*#5D99FF*/ #4b8dff}/*MENU背景　やや暗め*/
.bg_color4 {background-color: #45c0f1;}
.border_color1 {border-color: #dadada;}
.border_color2 {border-color: #f4a01b;}
.border_color3 {border-color: #ffffff;}
.border_color4 {
    border-color: #161726;
}
main, #pc_news {
    background: #f3f4f6;
}

#main_right.bg_color1 {
background-color: #f3f4f6;
}
#contents::after {
    background-color: rgba(255, 129, 18, 0.74)!important;
}
.hvr_txt_color3:hover {
    color: #0088d2;
}
.txt_color1 {color: #161726;}
.txt_color2 {color: #161726;}
.txt_color3 {color: #8e7607;}
.linkStyle{
	color:#0075c0;
border-bottom: 1px solid;
}
.linkStyle:hover{
	opacity: 0.7;
	transition: all 0.3s;
}
#pc_intro {
    background-color: #f3f4f6;
}
#main_left #footer_txt.bg_color1 {
    background-color: #f3f4f6;
    box-shadow: none;
    color: #171717;
}

#top_header h1 {
text-align: center;
}
#top_header h1 img {
width: 310px;
width: 244px;
margin: 0 auto 43px;
}



#contents {
margin-bottom: 0;
}
#contents, #contents2{padding-top: 100px!important;padding-bottom: 100px!important}
#contents .fs_wrap, #contents2 .fs_wrap{padding-top: 0!important;padding-bottom: 0!important}
#contents h3, #contents2 h3{margin-bottom: 50px!important}
#contents2{position: relative;background-position: center center;background-repeat: no-repeat;background-size: cover;}

#contents2::after {
    position: absolute;
    z-index: 0;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(56, 130, 255, 0.77)!important;
}
#contents2 .fs_wrap{position: relative;z-index: 1;}


#pc_intro .fs_wrap h3 {
width: 54%!important;
}
@media(min-width: 769px) {
#pc_intro figure {
    width: 87%!important;
}
#top_header {
background-color: transparent!important;
}
}
@media(max-width: 768px) {
#cms_6-c .arrow {
    bottom: -144px;
    height: 90px;
}
#intro h2 img {
    width: 341px;
}
#contents {
    margin-bottom: 0!important;
}
#main_right.bg_color1 {
    background-color: transparent;
}
.links_bt:before {
    left: -109px;
    width: 116px;
}
}
@media(max-width: 667px) {
#main_right, #pc_intro {
position: fixed;
}
#cms_6-c .arrow {
    bottom: -93px;
    height: 67px;
}
#main_right.bg_color1 {
    background-color: transparent;
}
#main_right:before {
    top: -33.5%;
    width: 100%;
    transform: skewY( 
352deg
 );
}
#main_right:after {
    top: 0;
    height: 100px;
    transform: skewY( 
0deg
 );
}
#top_header h1 img {
    width: 130px;
    margin: 0 auto;
}
#top_link .links_bt {
width: 110px!important;
}
#top_link .links_bt:before {
    top: -34px;
    left: -69px;
    width: 103px;
}
.links_bt {
width: 57px!important;
filter: drop-shadow(2px 2px 0px #ffffff);
}
.links_bt:before {
top: -13px;
    left: -49px;
    width: 67px;
}
#main_img {
    left: 64%;
}
#cms_6-c .cate_box {
margin-bottom: 60px
}
#contents .box_txt:before {
    width: 115px;
    right: 16px;
    bottom: -169px;
}
#contents2 .box_txt:before {
right: -39px;
    width: 125%;
    background-size: 200px auto;
    animation: bgroop 19s linear infinite;
}
}




@media all and (-ms-high-contrast: none) {

#contents2 .box_txt::before {
right: -244px;
width: 79%;
}
}