﻿.bg_color1 {background-color: #163963;}
.bg_color2 {
    background-color: #163963;
    color: #fff;
}
.border_color1 {border-color: #163963;}
.border_color3 {border-color: #dc143c;}
.txt_color_nomal {color: #163963;}
.txt_color1 {color: #dc143c;}


/* ----------　ローディング　---------- */
#loading_bg{
	height: 100vh;
	width: 100vw;
	z-index: 200;
	background-color: #163963;
}
#loading{
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#loading img{
	z-index: 1;
}
#loading .gauge{
	width: 0;
	-webkit-transform: skewX(10deg);
	-ms-transform: skewX(10deg);
	transform: skewX(10deg);
	transform-origin: left bottom;
	    background-color: #dc143c
}


/* ----------　all　---------- */
.linkStyle{
	color:#dc143c;
}
.linkStyle:hover{
	color:#dc143c;
	opacity: 0.7;
	transition: all 0.5s;
}
body{
font-family: ryo-gothic-plusn, sans-serif;
font-weight: 400;
font-style: normal;
}
h1, h2, h3, h4, h5, h6,.font_serif{
        font-family: ryo-gothic-plusn, sans-serif;
font-weight: 800;
font-style: normal;
}
footer #footer #footer_links li a {
    color: #ffffff;
}
header #header h1{
        text-align: right;
}
header .sns_links{
        width: 100%!important;
}

/*-------------------------------------------------------
				ページタイトルアニメーション
-------------------------------------------------------*/
.text_anime > span > span{
     display: inline-block;
     -webkit-transform: translateX(20px);
     transform: translateX(20px);
     -webkit-animation: .6s cubic-bezier(.78,.95,.69,.86) both;
     animation: .6s cubic-bezier(.78,.95,.69,.86) both;
     opacity: 0;
}
.text_anime > span > span:nth-child(2){
-webkit-transition-delay: 200ms;transition-delay: 200ms;
-webkit-animation-delay: 200ms;animation-delay: 200ms;
}
.text_anime > span > span:nth-child(2){
-webkit-transition-delay: 250ms;transition-delay: 250ms;
-webkit-animation-delay: 250ms;animation-delay: 250ms;
}
.text_anime > span > span:nth-child(3){
-webkit-transition-delay: 300ms;transition-delay: 300ms;
-webkit-animation-delay: 300ms;animation-delay: 300ms;
}
.text_anime > span > span:nth-child(4){
-webkit-transition-delay: 350ms;transition-delay: 350ms;
-webkit-animation-delay: 350ms;animation-delay: 350ms;
}
.text_anime > span > span:nth-child(5){
-webkit-transition-delay: 400ms;transition-delay: 400ms;
-webkit-animation-delay: 400ms;animation-delay: 400ms;
}
.text_anime > span > span:nth-child(6){
-webkit-transition-delay: 450ms;transition-delay: 450ms;
-webkit-animation-delay: 450ms;animation-delay: 450ms;
}
.text_anime > span > span:nth-child(7){
-webkit-transition-delay: 500ms;transition-delay: 500ms;
-webkit-animation-delay: 500ms;animation-delay: 500ms;
}
.text_anime > span > span:nth-child(8){
-webkit-transition-delay: 550ms;transition-delay: 550ms;
-webkit-animation-delay: 550ms;animation-delay: 550ms;
}
.text_anime > span > span:nth-child(9){
-webkit-transition-delay: 600ms;transition-delay: 600ms;
-webkit-animation-delay: 600ms;animation-delay: 600ms;
}
.text_anime > span > span:nth-child(10){
-webkit-transition-delay: 650ms;transition-delay: 650ms;
-webkit-animation-delay: 650ms;animation-delay: 650ms;
}
.text_anime > span > span:nth-child(11){
-webkit-transition-delay: 700ms;transition-delay: 700ms;
-webkit-animation-delay: 700ms;animation-delay: 700ms;
}
.text_anime > span > span:nth-child(12){
-webkit-transition-delay: 750ms;transition-delay: 750ms;
-webkit-animation-delay: 750ms;animation-delay: 750ms;
}
.text_anime > span > span:nth-child(13){
-webkit-transition-delay: 800ms;transition-delay: 800ms;
-webkit-animation-delay: 800ms;animation-delay: 800ms;
}
.text_anime > span > span:nth-child(14){
-webkit-transition-delay: 850ms;transition-delay: 850ms;
-webkit-animation-delay: 850ms;animation-delay: 850ms;
}
.text_anime > span > span:nth-child(15){
-webkit-transition-delay: 900ms;transition-delay: 900ms;
-webkit-animation-delay: 900ms;animation-delay: 900ms;
}

.text_anime.is-show > span > span
{
     -webkit-animation-name: slide-bs;
     animation-name: slide-bs;
     opacity: 1;
}
@keyframes slide-bs{
     0%{-webkit-transform: translateX(20px);transform: translateX(20px);}
     100%{-webkit-transform: translateX(0);transform: translateX(0);}
}

/* ----------　TOP　---------- */
#main_img {
    position: relative;
}
#main_img:before {
    content: '';
    display: inline-block;
    width: 80%;
    height: 500px;
    background-image: url(Dup/img/dec.png);
    background-size: contain;
    position: absolute;
    z-index: 9;
    top: 10%;
    left: -15%;
    transform: translateY(-50%);
    -webkit- transform: translateY(-50%);
        background-repeat: no-repeat;
}
#intro .intro_txt h2 {
    background-color: #dc143c;
}
#intro .intro_title h3{
        position: relative;
    margin-top: 30px;
    line-height: 1.5;
}
#intro .intro_title h3:before{
    content: '';
    width: 100px;
    height: 1px;
    background-color: #dc143c;
    transform: rotate(-35deg);
    left: -30px;
    position: absolute;
    top: -20px;
}

#wrap .intro_wrap{
    overflow: hidden;
    position: relative;
}
#intro{
       margin-bottom: 0px;
    padding-bottom: 200px; 
        padding-top: 100px;

}
#intro .intro_img,.intro_txt{
        z-index: 9;
    position: relative;
}
.main_inner{position: relative;}
#wrap .wrap_box{position: relative;}
#wrap .intro_wrap::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: url(../dup/img/back.png) repeat-y;
    background-size: 300px;
    background-position: 110% 0;
    background-attachment: fixed;
    -webkit-animation: bgroop 135s linear infinite;
    animation: bgroop 135s linear infinite;
    opacity: 0.4;
    z-index: 1;
        background-repeat: repeat;
}
@media screen and (min-width: 1250px){
#wrap .intro_wrap::before {
    background-size: 100%;
}
}
@-webkit-keyframes bgroop {
    from {background-position: 110% 0;}
    to {background-position: 1956px 0;}
    
}
@keyframes bgroop {
    from {background-position: 110% 0;}
    to {background-position:  1956px 0;}
}


#top_cms .top_cms_box:first-of-type,#top_cms .top_cms_box:last-of-type {
    margin-bottom: 0;
    background-color: #f1f3f6;
    padding-bottom: 50px;
    padding-top: 50px;
}
#top_cms .top_cms_box:first-of-type{
   margin-bottom: 50px; 
}
.cms_5-c .box_txt1::before {
    color: #163963;
}


/* ----------　下層ページ　---------- */
#cms_5-c .box_txt1::before{
    color: #163963;    
}

/* ----------　IE　---------- */
@media all and (-ms-high-contrast: none){


}

/* ----------　タブレット　---------- */
@media screen and (max-width: 768px){
header #header h1 {
    text-align: center;
}
#menu_bt > div span {
    height: 2px;
    background-color: #163963;
}
#main_img:before {
    height: 300px;
    top:auto;
    bottom: -50%;
}
#top_contents1 .contents1_txt {
    width: 90%!important;
    margin: auto;
}
 #top_contents1 .contents1_txt h3 {
    transform: translateX(0px);
}
#top_contents1{
        margin-bottom: 100px;
}
#page08 .tel a:hover {
    letter-spacing: 2px;
}
}


/* ----------　スマホ　---------- */
@media screen and (max-width: 667px){
#main_img:before {
    height: 170px;
   width: 90%;
}
#intro {
    padding-bottom: 70px;
    padding-top: 50px;
}
#top_contents1 {
    margin-bottom: 30px;
}
}