﻿

/*
#fakeloader{
    display:none;
}
*/

.sample_txt{
    z-index: 2;
    font-size: 2rem;
    text-shadow: 2px 2px 0 rgba(0,0,0,0.5);
    display:none;
}


/*--all page---------------------------
-------------------------------------*/
:root{
    --color1:#EDBBD4;
    --color2:#F9D1D8;
    --color3:#FF74B1;
    --color_black:#555;
    --color_gray:#777;
    --color_gold:#d3ac44;
}

.linkStyle{
    color:#bf9d74;
    transition:all 0.3s;
    text-decoration:underline;
}
.linkStyle:hover{
    opacity:0.7;
}

.font_14 {
    font-size: 16px;
}

body{
    overflow:hidden;
}
header.scr_header{
    backdrop-filter: blur(5px);
}
#pc_nav li a{
    color:var(--color_black);
}
#logo2 img{
    display: block;
    width: 150px;
}
.fix_bnr{
    left:20px;
    z-index:2;
}
.button_container span{
    background:var(--color_gray);
}
.button_container span:nth-of-type(1){
    color:var(--color_gray);
}
.overlay {
    background: linear-gradient(135deg, rgb(246 200 159 / 90%) , rgb(209 163 82) )!important;
}
.nav_menu_more a{
    background-color: #d3a658!important;
}
/*
.overlay .txt_white,
.overlay ul li a,
#overlay .left li:before,
#overlay .right .nav_menu_more a{
    color:var(--color_black);
}
*/


/*--top page---------------------------
-------------------------------------*/
.stars{
    height:fit-content;
    z-index: 3;
}

.star1 {
    width: 30px;
    left: 47%;
    top: 41%;
    animation: star-anim 8s 0s infinite;
}
.star2{
    width:26px;
    left:45%;
    top:39%;
    animation: star-anim2 8s 0s infinite;
}
.star3 {
    width: 33px;
    right: 45%;
    top: 38%;
    animation: star-anim 8s 0s infinite;
}
.star4 {
    width: 30px;
    left: 33%;
    top: 8%;
    animation: star-anim2 8s 0s infinite;
}
.star5 {
    width: 28px;
    left: 30%;
    top: 16%;
    animation: star-anim 8s 0s infinite;
}
.star6 {
    width: 25px;
    right: 34%;
    top: 10%;
    animation: star-anim 8s 0s infinite;
}
.star7 {
    width: 31px;
    right: 31%;
    top: 17%;
    animation: star-anim2 8s 0s infinite;
}

@keyframes star-anim {
  0% {opacity:0;}
  5% {opacity:1;}
  10% {opacity:0;}
  55% {opacity:0;}
  60% {opacity:1;}
  95% {opacity:0;}
  100% {opacity:1;}
}

@keyframes star-anim2 {
  0% {opacity:1;}
  5% {opacity:0;}
  10% {opacity:0;}
  55% {opacity:1;}
  60% {opacity:1;}
  95% {opacity:0;}
  100% {opacity:0;}
}

.catch1 {
    width: 58%;
    max-width: 1400px;
    left: 50%;
    transform: translateX(-50%);
    top: 18%;
    z-index: 2;
}
.catch2{
    /*
    width: 50vw;
    max-width: 900px;
    */
    left: 50%;
    bottom: 25%;
    z-index: 2;
    transform: translateX(-50%);
    
    color: #fff;
    font-weight: bold;
    font-size: 4rem;
    /*text-shadow: 4px 4px 0 #fff;*/
    
}
.catch2 img{
    filter: drop-shadow(2px 2px 0 rgba(0,0,0,0.4));
}
#top_pc_nav li a{
    padding:3px 10px;
    background-color:var(--color_gold);
    border-radius:20px;
}
#main_img .menu{
    bottom:13%;
    left:50%;
    transform:translateX(-50%);
    display:none;
}
#intro{
    background:url(./Dup/img/josei2.png) no-repeat center right / 45%;
}
.intro_item{
    width: 30vw;
    max-width: 500px;
    top: 3%;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0.8;
}
.nayami_box{
    margin-bottom:20px; 
    text-align:center;
}
.nayami_box li {
    font-size: 1.2rem;
    padding-left: 50px;
    background: url(./Dup/img/check.png) no-repeat center left/30px 30px;
    text-align: left;
    margin-bottom: 10px;
}
.intro_bnr,
.con3_bnr{
    border-radius:30px;
}

.video_wrap{
    height:720px;
}

.con1_subtitle,
.con2_subtitle{
    width: 300px;
    margin-left: -70px;
    margin-bottom: -20px;
}
.con3_subtitle{
    width:300px;
    margin:auto;
}

#con3{
    position:relative;
}
#con3::before {
    content: '';
    position: absolute;
    display: block;
    width: 24vw;
    height: 64vh;
    background: url(./Dup/img/josei.png) no-repeat;
    background-size: contain;
    background-position: bottom left;
    bottom: 0;
    left: 6%;
    z-index: 2;
}
#con3 .con_box{
    padding-top:3%;
    background-color: rgba(255,255,255,0.9);
    border-radius: 20px;
}
#con3 .con_txt{
    width:80%;
    margin-left:auto;
    margin-right:0;
}


.v_type1 .cate_box{
    border-radius:20px;
}
.v_type1 .triangle {
    display: block;
    border: var(--color_gray) solid 2px;
    box-shadow: 5px 5px 0 0 #e2e2e2;
}
.v_type1 .triangle:before {
    content: '';
    position: absolute;
    display: block;
    z-index: 1;
    border-style: solid;
    border-color: #FFF transparent;
    border-width: 13px 13px 0 0;
    bottom: -13px;
    left: 50%;
    margin-left: -9px;
}
.v_type1 .triangle:after {
    content: '';
    position: absolute;
    display: block;
    z-index: 0;
    border-style: solid;
    border-color: #555 transparent;
    border-width: 15px 15px 0 0;
    bottom: -17px;
    left: 50%;
    margin-left: -11px;
}

/*--under page---------------------------
-------------------------------------*/
#page_title .page_title_box{
    background-color: rgba(211,172,68,0.6);
}
#page3 #cms_2-g .sub_cate_img1{
    height:400px!important;
}
#page3 #cms_2-g .sub_cate_img1 img{
    width:100%!important;
    height:auto!important;
}

#cms_2-f .box_title1{
    padding-left:0;
    border-bottom:1px solid;
}
#cms_2-f .box_title1::after{
    display:none;
}

/* ---------- responshive ---------- */
@media screen and (max-width: 1536px){
.catch2{
    font-size:3rem;
}
}


@media screen and (max-width: 1366px){
.catch2{
    bottom:17%;
}
}

@media screen and (max-width: 1200px){
.catch2 {
    font-size: 2.5rem;
}
.star1 {
    left: 46%;
    top: 34%;
}
.star3{
    top:35%;
}
}


@media screen and (max-width: 950px){
.catch2 {
    font-size: 2.2rem;
}    
}


/* ---------- タブレット ---------- */
@media screen and (max-width: 768px){
.catch1 {
    width: 90%;
}
.catch2{
    width: 100%;
    font-size: 2.2rem;
    text-align: center;
    bottom:10%;
}
#intro {
    background: url(./Dup/img/josei2.png) no-repeat top right -61% / 62%;
}
.intro_item {
    width: 48vw;
    top: -1%;
}
.nayami_box li:last-child{
    letter-spacing: 1px;
}
.star1 {
    left: 42%;
    top: 46%;
}
.star2 {
    left: 45%;
    top: 41%;
}
.star3 {
    right: 42%;
    top: 47%;
}
.star4 {
    left: 10%;
}
.star5 {
    left: 7%;
    top: 14%;
}
.star6 {
    right: 10%;
}
.star7 {
    right: 8%;
    top: 13%;
}
.video_wrap {
    height: 42vh;
}
#con3::before{
    display:none;
}
#con3 .con_txt {
    width: 100%;
}
.con1_subtitle, .con2_subtitle,.con3_subtitle {
    width: 250px;
}

#page_title .page_title_box{
    width:70%;
}
}

/* ---------- スマートフォン ---------- */

@media screen and (max-width: 667px){
#fakeloader .fl{
    max-width:120px;
}
.catch1{
    width:67%;
    top:29%;
}
.catch2{
    font-size: 1.7rem;
    letter-spacing: 1px;
}
.star1 {
    left: 36%;
    top: 46%;
}
.star2 {
    left: 41%;
    top: 40%;
}
.star3 {
    right: 35%;
    top: 47%;
}
.nayami_box li {
    font-size: 1rem;
    padding-left: 30px;
    background: url(./Dup/img/check.png) no-repeat top 6px left/20px 20px;
}
.nayami_box li:last-child,
.intro_txt span{
    letter-spacing:0px;
}

.star4{
    top: 0;
    left: 2%;
}
.star5{
    top: 5%;
    left: -3%;
}
.star6{
    right: 15%;
    top: -2%;
}
.star7{
    top: 0%;
}
#intro {
    background: url(./Dup/img/josei2.png) no-repeat top 22% right -77% / 67%;
}
.con1_subtitle, .con2_subtitle, .con3_subtitle {
    width: 150px;
}
.con1_subtitle, .con2_subtitle {
    margin-left: -10px;
    margin-bottom: 0;
}
.video_wrap {
    height: 32vh;
}
#logo2 img {
    margin: auto;
}
.fix_bnr {
    left: 10px;
}
.page5 #page_title .page_title_box h2,
.page9 #page_title .page_title_box h2{
    font-size: 22px;
}
}




