﻿/*--------link_font--------*/
@font-face {
    font-family: 'ZenMaruGothic';
    font-style: normal;
    font-weight: 400;
    src: url('./Dup/img/ZenMaruGothic_r.woff') format('woff'),
        url('./Dup/img/ZenMaruGothic_r.eot')  format('eot');
    font-display: swap;
}

@font-face {
    font-family: 'ZenMaruGothic';
    font-style: normal;
    font-weight: 700;
    src: url('./Dup/img/ZenMaruGothic_b.woff') format('woff'),
        url('../Dup/img/ZenMaruGothic_b.eot')  format('eot');
    font-display: swap;
}

body {
    font-family: "ZenMaruGothic", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serぱif!important;
}

@font-face {
    font-family: 'caveat';
    font-style: normal;
    font-weight: 400;
    src: url('./Dup/img/caveat.woff') format('woff'),
        url('./Dup/img/caveat.eot')  format('eot');
    font-display: swap;
}

.linkStyle{color: #333333; text-decoration: underline;}


/*--------all_page--------*/
.pc_box .tel_bt{display:none;}
.fa-envelope:before {
    content: "\f095";
}
#main_img{
    z-index: -2;
}
main{position:relative}
main:before{
    content: " ";
    position: fixed;
    display: inline-block;
    width: 100vw;
    height: 120%;
    background: url(./Dup/img/cover.png) no-repeat;
    background-size: cover;
    left: 51%;
    top: 47%;
    transform: translate(-50%, -50%);
    z-index: -1;
    opacity: 0.55;
    transition: all 0.3s;
  }
  main.active:before{
    filter: blur(5px);
    transition: all 0.3s;
  }
@media screen and (min-width: 769px){
header{
    height: 93%;
    margin-top: 0.5%;
    margin-left: 1%;
    border-radius: 120px;
}
.head_banner a{
    margin: 0 auto;
    border-radius: 50px;
    width: 85%;
}
.main_box {
    width: 100%;
    margin-left: 0;
}
#contents1 {
    padding: 100px 10% 50px 23%;
}
#contents2 {
    padding: 150px 10% 295px 23%;
}
#contents3 {
    position: relative;
    padding: 0 10% 100px 23%;
}
#contents3.bg_color1 {
    background-color: #ecd2f1;
}
#contents3:before{
    content: "";
    position: absolute;
    left: 0;
    top: -100px;
    height: 100px;
    width: 100%;
    background: -webkit-gradient(radial, 50% 95%, 10, 50% 114%, 50, from(#ecd2f1), color-stop(0.49, #ecd2f1), color-stop(0.51, #fff), to(rgba(255,255,255,0)));
    -webkit-background-size: 49px 100%;
}
#contents3:after{
    content: "";
    position: absolute;
    left: 0;
    bottom: -100px;
    height: 100px;
    width: 100%;
    background: -webkit-gradient(radial, 50% 0, 10, 50% 0, 50, from(#ecd2f1), color-stop(0.49, #ecd2f1), color-stop(0.51, rgba(255,255,255,.3)), to(rgba(255,255,255,0)));
    -webkit-background-size: 49px 100%;
    z-index: -1;
}
#top_cms > .box {
    padding: 50px 7% 50px 23%;
}
footer {
    padding: 100px 6% 100px 23%;
}
article.page_wrap{
    padding: 100px 10% 100px 20%;
}
#page_title .page_box{
    padding: 80px 0 0 20%;
    text-align: left;
}
}
@media screen and (min-width: 789px) and (max-width: 1280px){
    #contents1 {
    padding: 100px 3% 100px 35%;
}
    #contents2 {
    padding: 200px 3% 250px 33%;
}
#contents3 {
    padding: 0 3% 250px 30%;
}
#top_cms > .box {
    padding: 50px 3% 50px 28%;
}
footer {
    padding: 100px 2% 100px 27%;
}
#page_title .page_box {
    padding: 80px 0 0 28%;
}
article.page_wrap {
    padding: 100px 3% 100px 29%;
}
}
.pc_box nav{
    margin-top:30px;
    margin-bottom:30px;
}
.pc_box .head_banner{margin-top: 7px;}
#main_img figure:after{
    content: "";
    position: absolute;
    display: inline-block;
    background: url(./Dup/img/catch.png) no-repeat;
    background-size: contain;
    width: 4%;
    height: 81%;
    left: 23%;
    top: 9%;
}
.youtube_wrap{5em 0 0;}
.youtube_box{
    position: relative;
    padding-bottom: 56.25%; 
    height: 0;
    overflow: hidden;
}
.youtube_box iframe{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
#contents_box{
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 5%, rgba(255, 255, 255, 1));
}
#contents1 .txt2{position:relative;}
#contents1 .txt2:before,#contents1 .txt2:after{
    content: "";
    position: absolute;
    display: inline-block;
    z-index: -1;
    opacity: 1;
    width: 2em;
    height: 2em;
}
#contents1 .txt2:before{
    background: url(./Dup/img/item_01.png) no-repeat;
    background-size: contain;
    left: -27px;
    top: -19px;
}
#contents1 .txt2:after{
    background: url(./Dup/img/item_02.png) no-repeat;
    background-size: contain;
    right: -27px;
    bottom: -19px;
}
#contents2{
background-image: url(./Dup/img/top_img01.png),url(./Dup/img/top_img02.png);
background-repeat: no-repeat;
background-size: 25%,20%;
background-position: 22% 84%,92% 0%;
}
#contents2 .txt4{position:relative;}
#contents2 .txt4:before,#contents2 .txt4:after{
    content: "";
    position: absolute;
    display: inline-block;
    z-index: -1;
    opacity: 1;
    width: 1.7em;
    height: 1.7em;
}
#contents2 .txt4:before{
    background: url(./Dup/img/item_03.png) no-repeat;
    background-size: contain;
    left: -27px;
    top: -17px;
}
#contents2 .txt4:after{
    background: url(./Dup/img/item_04.png) no-repeat;
    background-size: contain;
    right: -27px;
    bottom: -17px;
}
#contents3 .con3_txt_wrap{
    border-radius: 0px 0px 15px 15px;
    background-color: #fff;
    padding: 0px 30px 35px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 50px;
}
#contents3 figure{border-radius: 15px 15px 0 0;}
#contents3 .txt_white {
    color: #1a1a1a;
}
#contents3 .txt5,#contents3 .txt7{position:relative;z-index: +1;}
#contents3 .txt5:before,#contents3 .txt7:before{
    content: "";
    position: absolute;
    display: inline-block;
    z-index: -1;
    opacity: 1;
    width: 1.7em;
    height: 1.7em;
    background: url(./Dup/img/item_05.png) no-repeat;
    background-size: contain;
    left: -21px;
    top: 15px;
    transform: rotate(187deg);
}
.foot_tel_bt a {
    border-radius: 50px;
}
.more a{border-radius: 50px;}
.video_wrap{margin: 5em auto 0;}
.video_box{
    position: relative;
    padding-bottom: 56.25%; 
    height: 0;
    overflow: hidden;
}
.video_box video{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


/*--------subpage--------*/
#page_title .title_img {
    display: none;
}
#page_title h2{
font-family:"ZenMaruGothic", "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif!important}
#page8 .fa-envelope:before {
    content: "\f0e0";
}
/*--------mobile_tb--------*/
@media screen and (max-width: 768px){
header #logo {
    max-width: 250px;
}
.main_box {
    padding-top: 70px;
}
main:before {
    width: 121vw;
    height: 120%;
    left: 44%;
    top: 47%;
}
#contents2 {
    background-size: 37%,30%;
    background-position: 5% 104%,98% 0%;
    padding: 200px 10% 250px;
}
header .head_banner {
    width: 230px;
}
}

/*--------mobile_sp--------*/
@media screen and (max-width: 667px){

header #logo {
    max-width: 185px;
}
article.page_wrap {
    padding: 80px 5%;
}

#main_img img {
    min-height: 60vh;
}
#main_img figure:after {
    width: 7%;
    height: 84%;
    left: 9%;
    top: 9%;
}
main:before {
    width: 150vw;
    height: 109%;
    left: 43%;
    top: 47%;
}
.main_box {
    padding-top: 55px;
}
#contents2 {
    background-size: 69%,57%;
    background-position: 5% 99%,92% 0%;
    padding: 250px 10% 250px;
}




}


/*--------------------------------------------
IE
--------------------------------------------*/
@media all and (-ms-high-contrast:none){
.cms_1-a figure img{width:100%!important;height:auto!important;}

}
