/* YouTube */
.youtube_box{
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube_box iframe{
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}



/* PC ---------------------------------------------------------------------------------------------*/

div.neko01::before {
    background-image: url(dup/img/neko01.png);
    width: 330px;
    height: 134px;
    background-size: 100%;
    top: -110px;
    left: 9%;
    background-position: top;
    content: "";
    position: absolute;
    background-repeat: no-repeat;
    z-index: -1;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: 60%;
    transform: translateX(-50%);
}


div.neko02::before {
    background-image: url(dup/img/neko02.png);
    width: 330px;
    height: 129px;
    background-size: 100%;
    top: -120px;
    left: 51%;
    background-position: top;
    content: "";
    position: absolute;
    background-repeat: no-repeat;
    z-index: -1;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: 60%;
    transform: translateX(-50%);
}

div.neko03::before {
    background-image: url(dup/img/neko03.png);
    width: 330px;
    height: 129px;
    background-size: 100%;
    top: -100px;
    left: 23%;
    background-position: top;
    content: "";
    position: absolute;
    background-repeat: no-repeat;
    z-index: -1;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: 60%;
    transform: translateX(-50%);
}

#contents .box .box_item{
    background-image: url(dup/img/back.jpg);
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
}


/* color */
body,.txt_color_nomal{color: #333;}
.txt_white{color: white;}
.txt_red{color: red;}
.txt_color1{color: #ffa500;} /* メインカラー */
.txt_color2{color: #efefef;} /* サブカラー */
.txt_color3{color: #191970;} /* アクセントカラー1 */
.txt_color4{color: #f6f5ee;} /* アクセントカラー2 */

/* background-color */
.bg_white{background-color: white;} /* 白背景 */
.bg_black{background-color: black;} /* 黒背景 */
.bg_color1{background-color: #ffa500;} /* メインカラー */
.bg_color2{background-color: #efefef;} /* サブカラー */
.bg_color3{background-color: #191970;} /* アクセントカラー1 */
.bg_color4{background-color: #f7f6dc;} /* アクセントカラー2 */
.bg_color_clear{background-color: transparent!important;}


/* border-color ※!important */
.border_color1{border-color: #ffa500;}
.border_color2{border-color: #efefef;}
.border_color3{border-color: #191970;}
.border_color4{border-color: #f7f6dc;}


/* hover ---------------------------------------------------------------------------------------------*/
/* color */
.hvr_txt_color_nomal:hover{color: #000;}
.hvr_txt_white:hover{color: white;}
.hvr_txt_red:hover{color: red;}
.hvr_txt_color1:hover{color: #ffa500;} /* メインカラー */
.hvr_txt_color2:hover{color: #efefef;} /* サブカラー */
.hvr_txt_color3:hover{color: #191970;} /* アクセントカラー1 */
.hvr_txt_color4:hover{color: #f7f6dc;} /* アクセントカラー2 */

/* background-color */
.hvr_bg_white:hover{background-color: white;} /* 白背景 */
.hvr_bg_black:hover{background-color: black;} /* 黒背景 */
.hvr_bg_color1:hover{background-color: #ffa500;} /* メインカラー */
.hvr_bg_color2:hover{background-color: #efefef;} /* サブカラー */
.hvr_bg_color3:hover{background-color: #191970;} /* アクセントカラー1 */
.hvr_bg_color4:hover{background-color: #f7f6dc;} /* アクセントカラー2 */
.hvr_bg_color_clear:hover{background-color: transparent!important;}

/* border-color ※!important */
.hvr_border_color1:hover{border-color: #ffa500;}
.hvr_border_color2:hover{border-color: #efefef;}
.hvr_border_color3:hover{border-color: #191970;}
.hvr_border_color4:hover{border-color: #f7f6dc;}


.header img {
    width: 35%!important;
}

.marker {
    background: -webkit-linear-gradient(transparent 60%, #ff6 60%);
    background: -o-linear-gradient(transparent 60%, #ff6 60%);
    background: linear-gradient(transparent 60%, #9898c3 60%);
}

#contents {
    background-color: #e5fdff;
}

#footer .f_link  {
    background-color: #e5fdff;
}

#question:before{
    background-image: url(dup/img/back.jpg);
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
}

.menu ul a{
    font-weight: bold!important;
}

#foot_banner {
    font-size: 16px;
    text-align: center;
    padding-top: 30px;
    box-sizing: border-box;
    max-width: 300px;
    z-index: 20;
    bottom: 8px;
    right: 93px;
}
.overlay-menu ul{letter-spacing: 0px;}

#page10  a {
    width: 28%!important;
}

/* タブレット ---------------------------------------------------------------------------------------------*/

@media screen and (max-width: 768px){
    div.neko01::before  {
    background-image: url(dup/img/neko01.png);
    height: 134px;
    background-size: 100%;
    left: 9%;
    background-position: top;
    content: "";
    position: absolute;
    background-repeat: no-repeat;
    z-index: -1;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: 60%;
    transform: translateX(-50%);
}
    
div.neko02::before {
    background-image: url(dup/img/neko02.png);
    height: 129px;
    background-size: 100%;
    top: -130px;
    left: 13%;
    background-position: top;
    content: "";
    position: absolute;
    background-repeat: no-repeat;
    z-index: -1;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: 60%;
    transform: translateX(-50%);
}

div.neko03::before {
    background-image: url(dup/img/neko03.png);
    width: 350px;
    height: 149px;
    background-size: 100%;
    top: -120px;
    left: 23%;
    background-position: top;
    content: "";
    position: absolute;
    background-repeat: no-repeat;
    z-index: -1;
    -webkit-transform: translate(-50% , -50%);
    transform: translate(-50% , -50%);
    background-size: 60%;
    transform: translateX(-50%);
}
}

/* sp---------------------------------------------------------------------------------------------*/

@media screen and (max-width: 667px){
    div.neko01::before {
    display: none;
}
    
div.neko02::before {
    display: none;
}

div.neko03::before {
    display: none;
}

#foot_banner {
    font-size: 19px;
    text-align: center;
    /* padding-top: 31px; */
    box-sizing: border-box;
    max-width: 300px;
    z-index: 20;
    bottom: 51px;
    /* right: 92px; */
    padding-left: 75px;
}

#page_title h2{
    letter-spacing: 2px;
}

#question p{
    font-size: 13px;
}

footer .footer_con_box a:hover {
    letter-spacing: 1px;
}
    
#page_title h2 {
    letter-spacing: 0px;
}
}