﻿@import url('https://fonts.googleapis.com/css2?family=IM+Fell+English+SC&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Kaisei+HarunoUmi:wght@400;500;700&display=swap');

@font-face {
    font-family: 'KaiseiHarunoUmi';
    font-style: normal;
    font-weight: 400;
    src: url('./Dup/img/KaiseiHarunoUmi_r.woff') format('woff'),
        url('./Dup/img/KaiseiHarunoUmi_r.eot')  format('eot');
    font-display: swap;
}
@font-face {
    font-family: 'KaiseiHarunoUmi';
    font-style: normal;
    font-weight: 700;
    src: url('./Dup/img/KaiseiHarunoUmi_b.woff') format('woff'),
        url('../Dup/img/KaiseiHarunoUmi_b.eot')  format('eot');
    font-display: swap;
}

.font1,
.cms_title p,
#top_cms .more a,
#top_info .info_title p,
#page10 .cms_wrap ul li a .font_2dw{
    font-family: 'IM Fell English SC', serif;
}
.font2,
.font_serif,
#top_cms h2,
#top_info h2,
#pc_nav li a,
#sp_nav li a,
.page_title_box h2,
.page_title_box p{
    font-family: 'Kaisei HarunoUmi',"游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";
}

.linkStyle{
    color:#bf9d74;
}
.linkStyle:hover{
    transition:all 0.3s;
    opacity:0.7;
    text-decoration:underline;
}

/*
#page-top{
    position:absolute;
}
*/

#top_info .tel_bt,
#sp_nav .tel_bt,
#contact_tel{
    display:none;
}

/*--all page---------------------------
-------------------------------------*/
body{
    font-size:16px;
}
#body{
    overflow:hidden;
}
#wrap{
    background-color:#00afcc;
}
#pc_nav li a{
    color:white;
    font-size: 1.5rem;
}
#sp_nav li a{
    font-size: 1.5rem;
}
header .trans_logo{
    background-color: #78d9e9!important;
}
.trans_logo img{
    max-width:250px;
}
#logo2{
    background-color:#78d9e9;
}
#logo2 img{
    max-width:300px;
}
#footer .footer_bottom{
    background-color: #00afcc;
    color:white;
}
#page-top a{
    background-color: transparent;
}

#page-top a::before{
	content: "";
	position: absolute;
	background-image:url(./Dup/img/page-top.png);
	background-repeat:no-repeat;
	background-size:contain;
	width: 40px;
	height: 40px;
	right: 0;
	left: 0;
	top: 10px;
	bottom: 0;
	margin: auto;
}

#gmap{
    display:none;
}
#page07 .info_map {
    height: 0;
    margin-top:0;
}

/*--top page---------------------------
-------------------------------------*/
#logo{
    background-color:transparent;
}
#logo span{
    display:none;
}

.t_header{
    background-color:transparent;
    background: url(./Dup/img/hd1.png),
                url(./Dup/img/hd2.png),
                url(./Dup/img/hd3.png),
                url(./Dup/img/hd4.png),
                url(./Dup/img/hd5.png),
                /*linear-gradient(0deg, #00afcc 0%, #8be5e3 30%, #00afcc 100%);*/
                #20c9e5;
                
    background-repeat:no-repeat,
                      no-repeat,
                      no-repeat,
                      no-repeat,
                      no-repeat;
    background-position:top left,
                        top right,
                        bottom left,
                        bottom right,
                        center center,
                        top left;
    background-size:100px 100px,
                    100px 100px,
                    100px 100px,
                    100px 100px,
                    550px 500px,
                    100% 100%;
    position:relative;
    padding-bottom:50px;
    width: 300px;
    z-index:2;
}

.t_header #pc_nav li a{
    text-align: center;
    font-size: 1.5rem;
    padding: 0;
    line-height: 2;
}
.hd_con{
    width:120px;
    margin:auto;
}
.hd_con .con{
    font-size: 1.4rem;
    margin-top: 10px;
    border-top: 2px solid #40268a;
    border-bottom: 2px solid #40268a;
    color:#40268a!important;
}
.t_header #logo{
    padding-bottom:0;
}
.t_header #logo img{
    max-width:18vw;
}
#main_img{
    position:relative;
    z-index:2;
}
#main_img:before{
    content:'';
    position:absolute;
    display:block;
    width:100%;
    height:100%;
    background-color:rgba(0,0,0,0.2);
    top:0;
    left:0;
    z-index:2;
    pointer-events:none;
}
.catch{
    width: 25vw;
    top: 30%;
    left: 32%;
    background-color: rgba(6,83,111,0.3);
    padding: 20px 30px;
    z-index: 2;
}
.contents_wrap .contents_bg{
    background-color:transparent;
    background: rgb(25,207,246);
    background: url(./Dup/img/moji.png),linear-gradient(180deg, rgba(12,139,172,1) 0%, rgba(72,188,219,1) 100%);
    background-repeat:repeat-y;
    background-size:50%,100% 100%;
}
.con1_left{
    z-index:2;
}
.con1_right{
    position:relative;
    background-image:url(./Dup/img/hors.png);
    background-repeat:no-repeat;
    background-size:300px auto;
    background-position:center center;
}
.con1_right h2,
.con1_right p,
.con3_left,
.con3_right{
    position:relative;
    z-index:2;
}
.con1_right .font1{
    font-size: 1.5rem;
    letter-spacing: 5px;
    line-height: 1.2;
}
.con1_right h2{
    font-size:2.5rem;
}
.en{
    top: -34%;
    left: -26%;
    z-index: 1;
    -webkit-animation: rotate 30s linear infinite;
    animation: rotate 80s linear infinite;
    width: 100vw;
    pointer-events:none;
    opacity:0.3;
}
@keyframes rotate {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}
.contents_bg{
    z-index:2;
}
.con2_wrap{
    position:relative;
    z-index:3;
    background-image:url(./Dup/img/item1.png),
                     url(./Dup/img/item2.png),
                     url(./Dup/img/item3.png),
                     url(./Dup/img/item4.png),
                     url(./Dup/img/bg.png);
    background-repeat:no-repeat,
                      no-repeat,
                      no-repeat,
                      no-repeat,
                      no-repeat;
    background-size:80px 80px,80px 80px,80px 80px,80px 80px,cover;
    background-position:top 10px left 10px,top 10px right 10px,bottom 10px left 10px,bottom 10px right 10px,top left;
    border:2px solid white;
}
.con2_title .font1{
    font-size: 1.2rem;
    padding-left: 20px
}
.con3_title .font1{
    font-size: 1.2rem;
}
.logo_item{
    bottom: -28%;
    right: -6%;
    z-index: 1;
    padding: 10px;
    /*border:2px solid #ab9150;
    background: url(./Dup/img/logo1.png), url(./Dup/img/logo2.png), url(./Dup/img/logo3.png), url(./Dup/img/logo4.png);
    background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
    background-position: top left, top right, bottom left, bottom right;
    background-size: 30px 30px, 30px 30px, 30px 30px, 30px 30px;
    */
    background-color: #000000;    
}
.logo_item img{
    width:220px!important;
    height:auto!important;
}
#top_cms .top_cms_bg{
    background-color: #ab9150;
}
#top_cms .cms_main {
    padding-left: 50px;
    padding-top: 120px;
}
#top_cms .cms_wrap{
    padding:50px;
}
#top_cms .cms_title{
    position:relative;
}
#top_cms .cms_title:before{
    content: '';
    position: absolute;
    display: block;
    width: 370px;
    height: 370px;
    background-image: url(./Dup/img/hd5.png);
    background-repeat: no-repeat;
    background-size: contain;
    top: -50px;
    left: -70px;
    z-index: 1;
    pointer-events:none;
}

#top_cms .cms_title > div{
    border-top:0;
}
#top_cms .more a,
#top_info .more a{
    color: white;
    border-color: white;
}
#top_cms .more a:hover{
    color:#ab9150;
}

#top_cms .more span.d_block{
    background-color:white;
}

#top_info .more a:hover{
    border-color: #ab9150;
    /*color:#ab9150;*/
}
#top_cms .cms_title p,
#top_cms .cms_title h2{
    color:white;
}
#top_info .info_title span{
    background-color: white;
}
#top_info h2,
#top_info .info_title p{
    color:white;
}
#top_info .more a{
    font-size: 1.3rem;
}
.info_left .tel_bt a{
    color:white;
}

.cms_3-c .box_title1{
    font-family: 'Kaisei HarunoUmi',"游明朝", "YuMincho", "ＭＳ Ｐ明朝", "MS PMincho","ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "Sawarabi Mincho", "serif";
    font-weight:500;
    font-size: 1.5rem;
}


/*--under page---------------------------
-------------------------------------*/
header .page_title_bg{
    background-color: #78d9e9;
}
.page_title_box h2{
    font-size: 3rem;
}
.page_title_box p{
    font-size:1.7rem;
}
.cate_list li a{
    color: #40268a;
    font-size:1.2rem;
    font-weight: bold;
}
.cms_wrap{
    background-color:white;
}
.under_page #logo img{
    width:220px;
}
.under_page .cms_wrap{
    background: url(./Dup/img/hd1.png),
                url(./Dup/img/hd2.png),
                url(./Dup/img/hd3.png),
                url(./Dup/img/hd4.png),
                url(./Dup/img/hd5.png),
                white;
    background-repeat:no-repeat,
                      no-repeat,
                      no-repeat,
                      no-repeat;
    background-position:top 10px left 10px,
                        top 10px right 10px,
                        bottom 10px left 10px,
                        bottom 10px right 10px,
                        center center;
    background-size:100px 100px,
                    100px 100px,
                    100px 100px,
                    100px 100px,
                    550px 500px;
    border:2px solid #ab9150;
    padding:100px 30px;
}
.footer_nav{
    background-color: #00afcc;
}
.footer_nav li a{
    color:white;    
}


/* ---------- responshive ---------- */
@media screen and (max-width: 1400px){
.en{
    width:1500px;
    top: -17%;
    left:-28%;
}
.logo_item img {
    width: 170px!important;
}
}

@media screen and (max-width: 1200px){
.en{
    top:-14%;
    left:-45%;
}
}

@media screen and (max-width: 1100px){
/*
.en{
    width: 1400px;
}
*/
.con1_right h2 {
    font-size: 2.3rem;
}
}

@media screen and (max-width: 1000px){
.en {
    top: -11%;
    left: -60%;
}
}

/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
.catch{
    width: 45vw;
    top: 40%;
    left: 23%;
    z-index: 3;
}
.contents_wrap .contents_bg{
    width:100%;
    background-size: 90%,100% 100%;
}
.en {
    top: -29%;
    left: -47%;
}
#contents1 .con1_left {
    height: 55vw;
}
.con2_wrap{
    background-position: top 5px left 5px,top 5px right 5px,bottom 5px left 5px,bottom 5px right 5px,top left;
}
.con2_title h2{
    font-size:1.6rem;
}
.con2_right{
    margin-bottom:30px;
}
.logo_item{
    right:-10%;
}
#top_cms .cms_title:before{
    width: 250px;
    height: 250px;
    top: -20px;
    left: -50px;
}
#top_cms .more span.d_block{
    background-color: #ab9150;
}
#top_cms .cms_main{
    padding-top: 0;
    padding-left: 20px;
}
#top_info{
    background-color: #0e7590;
}
.sns_links li{
    padding-bottom:10px;
}
.under_page .cms_wrap{
    background-position: top 5px left 5px,top 5px right 5px,bottom 5px left 5px,bottom 5px right 5px;
}
}

/* ---------- スマートフォン ---------- */
@media screen and (max-width: 667px){
.catch {
    width: 62vw;
    top: 40%;
    left: 13%;
}
.con1_right{
    padding-left: 30px;
    padding-right: 30px;
}
.con1_right h2 {
    font-size: 1.4rem;
}
#contents2 .con2_wrap,
#contents3 .con3_wrap{
    padding: 50px 15px;
}
.en{
    left: -145%;
    top: 0%;
    width: 1600px;
}
.con2_wrap{
    background-size: 60px 60px,60px 60px,60px 60px,60px 60px,cover;
}
.logo_item {
    bottom: -43%;
    right: -6%;
    padding: 10px;
}
.logo_item img {
    width: 120px!important;
}
#top_cms{
    padding-bottom: 10px;
}
#top_cms .cms_wrap {
    padding: 20px;
}
#top_cms .more span.d_block{
    background-color: #af9451;
}
.cms_3-c,
.cms_6-c{
    padding:20px;
}
.under_page .width_1280-max{
    padding:20px;
}
.under_page .cms_wrap{
    background-size: 60px 60px,60px 60px,60px 60px,60px 60px;
}
.page_title_box h2 {
    font-size: 2.5rem;
    letter-spacing: -2px;
}
#cms_3-c .box_txt1{
    padding:20px 0!important;
}
#cms_3-c .box_title1{
    letter-spacing:3px;
}
#cms_6-c .box_title{
    letter-spacing: 0px;
}
#sp_nav li a{
    line-height:1.5;
}

#top_info #map{
    height:300px;
}

}

/* ---------- IEの処理 ---------- */
@media all and (-ms-high-contrast: none){
#contact_tel a{
    padding-top:35px;
}
}


