@charset "UTF-8";
/* CSS Document */

html{
margin: 0;
padding: 0;
color: #1e1b1b;
font-weight: 300;
}
body{
margin: 0;
padding: 0;
}
.pc_display{
display: inherit;
}
.sp_display{
display: none;
}
.font-style{
font-family: 'BIZ UDMincho', serif;
}
.x-small{
font-size: 0.8rem;
}
.pink{
color: #FF7B98;
}
.p-blue{
color: #3F95E1;
}
.bg-pink{
background-color: #F6D0E0;
}
.bg-p-blue{
background-color: #CEE2F5;
}
.w-60{
width: 60%;
height: auto;
margin: 0 auto 60px auto;
}
a{
color: #1e1b1b !important;
text-decoration: none !important;
}
.mt-10{
margin-top: 100px;
}
header h1{
margin:5px 0; 
font-size: 10px;
font-weight: normal;
}
#navbarNavAltMarkup a:hover{
color: #f2a4ba !important;
}
#main_img{
background-image: url("images/index_bg.png");
background-repeat: no-repeat;
background-size: 100%;
height: 100vh;
}
#main_img img{
max-height:100%; 
}
.index_mainnav{
width: 45px;
height: 45px;
border: 1px solid;
border-color: transparent transparent #1e1b1b #1e1b1b;
transform: rotate(-45deg);
margin: 60px auto 0 auto;
padding: 0;
}
.openbtn{
display: none;
}
#g-nav{
display: none;
}
#blog_topics{
margin-bottom: 40px;
}
#blog_topics img{
margin-right:5%;
vertical-align: middle;
}
#blog_frame{
width: 100%;
height: 200px;
overflow: hidden;
}
#index_catalog{
width: 100%;
height: auto;
background-color: #d2d2d2;
padding:15px 0 5px 0;
}
#index_col_01{
background-image: url("images/index_menubg01.png");
background-repeat: no-repeat;
background-size:cover;
background-position: center;
padding: 50px 0 15px 0;
}
#index_col_02{
background-image: url("images/index_menubg02.png");
background-repeat: no-repeat;
background-size:cover;
background-position: center;
padding: 50px 0 15px 0;
}
#index_col_03{
background-image: url("images/index_menubg03.png");
background-repeat: no-repeat;
background-size:cover;
background-position: center;
padding: 50px 0 15px 0;
}
#index_col h3{
text-align: center;
font-size: 1.8rem;
margin-bottom: 40px;
}
#index_col p{
width: 50%;
height: auto;
margin: 0 auto 50px auto;
text-align: left;
}
#index_col{
text-align: center;
}
.btn{
background-color: #fff;
padding:5px 30px;
text-align: center;
margin: 0 auto 15px auto !important;
position: relative;
font-size: 0.8rem;
border-bottom: thin #E6E6E6;
border-right: thin #E6E6E6;
box-shadow:1px 1px 6px #E6E6E6;
}
.btn span{
display:inline-block;
}
.btn span::after{
position:absolute;
margin-right: 5px;
cursor: pointer;
outline: none;
border-top: 1px solid #9E5FA3;
border-right: 1px solid #9E5FA3;
content: "";
height: 10px;
width: 10px;
top: 30%;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.header_title{
padding: 100px 0;
margin-bottom: 40px;
text-align: center;
font-size: 2.0rem;
color: #534741;
font-family:'BIZ UDMincho', serif;
text-shadow: 1px 1px 1px #fff;
}
.sp_info_box{
display: none;
}
.info_box{
background-image: url("images/tenji_bg.png");
background-repeat: no-repeat;
background-position: center;
background-size:cover;
padding: 100px 0 30px 0;
}
.info_tenzi{
width: 40%;
height: auto;
background-image: url("images/tenji_box.png");
background-size:80%;
background-position: center;
background-repeat: no-repeat;
padding: 150px 0 150px 0;
text-align: center;
}
.info_tenzi h3{
margin-bottom: 30px;
}
.info_tenzi p{
text-align: left;
width: 40%;
height: auto;
margin: 0 auto;
}
.g-map iframe{
width: 100%;
padding: 0;
margin-bottom: 10px;
}
.contact_btn{
position: fixed;
bottom: 3%;
right: 5%;
width: 10%;
}
.contact_btn img{
width: 100%;
height: auto;
}
#furisode_main{
background-image: url("images/index_bg.png");
background-repeat: no-repeat;
background-position: right;
background-size: auto;
}
#furisode_main h2{
width: 60%;
height: auto;
margin: 5% auto 0 auto;
text-align: left;
line-height: 1.4;
}
footer{
padding:50px 0; 
}
.contents_title{
text-align: center;
font-size: 1.6rem;
color: #9E5FA3;
font-family:'BIZ UDMincho', serif;
margin: 20px 0;
}
.furisode_menu{
font-size: 1.4rem;
text-align: center;
line-height: 1.4;
padding: 100px 0;
margin: 0 0 40px 0;
}
#f_menu01{
background-image: url("images/furisode_02.png");
background-repeat: no-repeat;
background-position: center;
}
#f_menu02{
background-image: url("images/furisode_03.png");
background-repeat: no-repeat;
background-position: center;
}
.price{
font-size: 2.0rem;
font-style: italic;
margin: 0 0 40px 0;
}
.s-list{
margin: 0 auto 40px auto;
font-size: 0.9rem;
}
.s-list li{
list-style: none;
margin: 0;
padding: 15px 0 15px 40px;
background-image:url("images/s_list01.png");
background-repeat: no-repeat;
background-position: left;
background-size: 24px;
text-align: left;
}
.s-list li:nth-child(2n){
background-image:url("images/s_list02.png");
}
.f_tokuten_list{
text-align: left;
list-style: none;
}
.f_tokuten_list li{
margin-bottom: 15px;
}
#f_tokuten01{
width: 60%;
height: auto;
margin: 0 auto 40px auto;
border-top:1px solid #F2A4BA;
border-bottom:1px solid #F2A4BA;
padding: 40px 0;
}
#f_tokuten02{
width: 60%;
height: auto;
margin: 0 auto 40px auto;
border-top:1px solid #9EB5DC;
border-bottom:1px solid #9EB5DC;
padding: 40px 0;
}
.f_collection{
margin: 60px 0;
}
.f_collection img{
width: 90%;
margin: 0 auto 10px;
}
ul.gallery-list li{
list-style: none;
margin: 0 auto 10px auto;
}
.mamafuri_box{
font-family:  'BIZ UDMincho', serif;
}
.mamafuri_box ul{
margin: auto;
list-style: none;
}
.mamafuri_box ul li{
font-size: 1.2rem;
margin-bottom: 10px;
}
#mamafuri_01{
background-image: url("images/mamafuri_03.png");
background-repeat: no-repeat;
background-position: center;
background-size: 60%;
font-size: 1.8rem;
padding: 60px 0;
}
#mamafuri_02{
background-image: url("images/mamafuri_04.png");
background-repeat: no-repeat;
background-position: center;
background-size: 60%;
font-size: 1.8rem;
padding: 60px 0;
}
#rental_box{
background-image: url("images/rental_03.png");
font-family:'BIZ UDMincho', serif;
padding-bottom: 40px;
}
#rental_box h3{
text-align: center;
font-size: 2.0rem;
color: #9E5FA3;
margin: 0;
padding: 70px 0;
background-image: url("images/rental_02.png");
background-repeat: no-repeat;
background-size: 100%;
}
#rental_box ul{
width: 60%;
height: auto;
margin: 40px auto;
font-size: 1.6rem;
list-style: none;
padding: 0;
}
#rental_box ul li{
padding: 0;
margin-bottom:20px;
}
#rental_box ul li span.name{
display: inline-block;
width: 35%;
height: auto;
}
#rental_box ul li span.ck{
display:inline;
font-size: 0.6rem;
margin-left: 5px;
}
#catalogue_title{
background-image: url("images/catalogue_01.png");
background-repeat: no-repeat;
background-size: 100%;
background-position: bottom;
}
#clinic_title{
background-image: url("images/clinic_01.png");
background-repeat: no-repeat;
background-size: 100%;
background-position: bottom;
}
#cleaning_title{
background-image: url("images/cleaning_01.png");
background-repeat: no-repeat;
background-size: 100%;
background-position: bottom;
}
#catalogue_list{
width: 75%;
height: auto;
margin: 0 auto 40px auto;
display:flex;
}
.catalogue_con{
width: 48%;
height: auto;
background-image: url("images/rental_03.png");
padding: 20px 40px;
background-position: center;
}
.catalogue_con:nth-child(2n){
background-image: url("images/rental_03.png");
background-position: right;
}
.catalogue_con:nth-child(3n){
background-image: url("images/rental_03.png");
background-position: left;
}
#catalogue_list div h2{
text-align: center;
font-size: 1.4rem;
color: #534741;
font-family:'BIZ UDMincho', serif;
margin-bottom: 20px;
}
#catalogue_list div p{
font-size: 0.9rem;
}
#clinic_list{
width: 75%;
height: auto;
margin: 0 auto 40px auto;
}
.clinic_con{
width: 100%;
height: auto;
padding: 20px 40px;
background-image:url("images/clinic_02.png");
background-position: left;
display: flex;
position: relative;
}
.clinic_con:nth-child(2n){
background-image:url("images/clinic_02.png");
background-position: right;
}
.clinic_con:nth-child(3n){
background-image:url("images/clinic_02.png");
background-position: center;
}
#clinic_list div{
width: 100%;
height: auto;
margin: 0 auto 10px auto;
justify-content: flex-start;
}
#clinic_list div h2{
width: 100%;
display: inherit;
font-size: 1.4rem;
color: #534741;
line-height: 1.4;
font-family:'BIZ UDMincho', serif;
margin-bottom: 20px;
}
#clinic_list div h2 span{
vertical-align: middle;
}
#clinic_list div p{
width: 90%;
font-size: 0.9rem;
}
#clinic_list img{
width: 50%;
height: auto;
justify-content: flex-end;
}
#cleaning_topic{
text-align: center;
font-weight: 600;
color: #534741;
margin-bottom: 40px;
}
#cleaning_topic span{
font-size: 1.0rem;
}
.cleaning_title{
text-align: center;
font-size: 1.6rem;
font-family:'BIZ UDMincho', serif;
margin: 60px 0;
}
.cleaning_title::before{
content: '';
display: inline-block;
background-image:url("images/cleaning_03.png"); 
background-size: contain;
background-repeat: no-repeat;
vertical-align: middle;
width: 80px;
height: 20px;
margin-right: 30px;
}
.cleaning_title::after{
content: '';
display: inline-block;
background-image:url("images/cleaning_03.png"); 
background-size: contain;
background-repeat: no-repeat;
vertical-align: middle;
width: 80px;
height: 20px;
margin-left: 30px;
}
#cleaning_flow{
display: flex;
justify-content: space-between;
margin: 40px 40px 40px 0;
text-align: center;
font-family:'BIZ UDMincho', serif;
}
#flow_01{
width: 100%;
height: auto;
background-image: url("images/cleaning_04.png");
background-repeat: no-repeat;
background-position: center;
background-size: 100%;
padding:40px 5% 40px 0;
margin-right: 5%;
}
#flow_02{
width: 100%;
height: auto;
background-image: url("images/cleaning_05.png");
background-repeat: no-repeat;
background-position: center;
background-size: 100%;
padding:40px 5% 40px 0;
margin-right: 5%;
}
#flow_03{
width: 100%;
height: auto;
background-image: url("images/cleaning_06.png");
background-repeat: no-repeat;
background-position: center;
background-size: 90%;
padding:40px 0;
}
.flow_step{
color: #1B1464;
font-size: 1.2rem;
margin:0 0 30px 0;
}
.cleaning_plan{
font-size: 1.8rem;
font-family:'BIZ UDMincho', serif;
text-align: center;
position: relative;
margin-bottom: 40px;
padding: 20px 0;
}
.cleaning_plan span{
font-size: 1.0rem;
vertical-align: middle;
position: relative;
margin-right: 20px;
}
#plan_01{
background-image: url("images/cleaning_07.png");
background-repeat: no-repeat;
background-size: 60%;
background-position: center;
}
#plan_02{
background-image: url("images/cleaning_08.png");
background-repeat: no-repeat;
background-size: 60%;
background-position: center;
}
#plan_03{
background-image: url("images/cleaning_09.png");
background-repeat: no-repeat;
background-size: 60%;
background-position: center;
}
#plan_table{
width: 1080px;
height: auto;
margin: 0 auto 40px auto;
table-layout: fixed;
border-collapse: collapse;
border:solid 1px #CEE2F5;
}
#plan_table th{
width: 25%;
text-align: center;
font-family:'BIZ UDMincho', serif;
padding: 10px 0;
border:solid 1px #CEE2F5;
}
#plan_table td{
text-align: center;
padding: 10px 0;
border:solid 1px #CEE2F5;
}
#plan_table tr{
background-color: #fff;
}
#plan_table tr:nth-child(odd){
background-color: #CEE2F5;
}
#plan_table span{
display: block;
font-size: 0.8rem;
padding: 0;
margin-bottom: 3px;
}
#plan_table01{
background-image: url("images/cleaning_07.png");
background-position: center;
}
#plan_table02{
background-image: url("images/cleaning_08.png");
background-position: center;
}
#plan_table03{
background-image: url("images/cleaning_09.png");
background-position: center;
}
#tenpo_box{
margin: 0 auto 40px auto;
font-family:'BIZ UDMincho', serif;
}
#tenpo_box table{
width: 100%;
height: auto;
}
#tenpo_box table th{
width: 30%;
height: auto;
padding: 10px 5px;
border-bottom: solid 2px #9E5FA3;
text-align: center;
}
#tenpo_box table td{
padding: 10px 5px 10px 20px;
border-bottom: solid 1px #B8B8B8;
}

#mail_box{
margin: 0 auto 40px auto;
font-family:'BIZ UDMincho', serif;
}
#mail_box form table{
width: 100%;
height: auto;
}
#mail_box form table th{
width: 40%;
height: auto;
padding: 10px 5px;
border-bottom: solid 2px #9E5FA3;
text-align:left;
}
#mail_box form table td{
padding: 10px 5px 10px 20px;
border-bottom: solid 1px #B8B8B8;
}
#mail_box .input_box{
width: 96%;
border: solid 1px #D8D8D8;
}
.btn_style{
width: auto;
height: auto;
padding: 15px 60px;
background-color: #9E5FA3;
color: #fff;
border:none;
display: inline-block;
}
.btn_style:hover{
background-color: #D8D8D8;
color: #1e1b1b;
}
#call_btn{
padding: 5px 60px;
margin: 20px auto;
background-color: #9E5FA3;
font-size: 2.0rem;
font-weight: 600;
color: #fff;
display: inline-block;
}
#call_btn a{
color: #fff !important;
}
#call_btn a:hover{
color: #F6F0F6;
}
/*スクロールダウン全体の場所*/
.scrolldown{
/*描画位置※位置は適宜調整してください*/
position:absolute;
bottom:2%;
left:50%;
}
/*Scrollテキストの描写*/
.scrolldown span{
/*描画位置*/
position: absolute;
left:5px;
bottom:5%;
/*テキストの形状*/
color: #1e1b1b;
font-size: 0.5rem;
letter-spacing: 0.05em;
/*縦書き設定*/
-ms-writing-mode: tb-rl;
-webkit-writing-mode: vertical-rl;
writing-mode: vertical-rl;
}
/* 丸の描写 */
.scrolldown:before {
content: "";
/*描画位置*/
position: absolute;
bottom:0;
left:-2px;
/*丸の形状*/
width:6px;
height:6px;
border-radius: 50%;
background:#1e1b1b;
animation:
circlemove 1.6s ease-in-out infinite,
cirlemovehide 1.6s ease-out infinite;
}
/*下からの距離が変化して丸の全体が上から下に動く*/
@keyframes circlemove{
0%{bottom:45px;}
100%{bottom:-5px;}
}
/*上から下にかけて丸が透過→不透明→透過する*/
@keyframes cirlemovehide{
0%{opacity:0}
50%{opacity:1;}
80%{opacity:0.9;}
100%{opacity:0;}
}
/* 線の描写 */
.scrolldown:after{
content:"";
/*描画位置*/
position: absolute;
bottom:0;
left:0;
/*線の形状*/
width:2px;
height: 50px;
background:#1e1b1b;
}
/*フェード*/
.fadeUp {
animation-name:fadeUpAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity: 0;
}
@keyframes fadeUpAnime{
from {
opacity: 0;
transform: translateY(100px);
}

to {
opacity: 1;
transform: translateY(0);
}
}
.delay-time02{
animation-delay: 0.6s;
}
.delay-time03{
animation-delay: 0.9s;
}
.delay-time04{
animation-delay: 1.2s;
}
/*スライダー*/
.slider {
width:94%;
margin:10px auto;
padding: 0;
}
.slider img {
width:500px;
height:auto;
margin: 0 auto;
}
.slider .slick-slide {
transform: scale(0.7);/*左右の画像のサイズを80%に*/
transition: all .5s;/*拡大や透過のアニメーションを0.5秒で行う*/
opacity: 0.5;/*透過50%*/
}
.slider .slick-slide.slick-center{
transform: scale(1);/*中央の画像のサイズだけ等倍に*/
opacity: 1;/*透過なし*/
}
.slick-prev, 
.slick-next {
position: absolute;/*絶対配置にする*/
top: 42%;
cursor: pointer;/*マウスカーソルを指マークに*/
outline: none;/*クリックをしたら出てくる枠線を消す*/
border-top: 2px solid #666;/*矢印の色*/
border-right: 2px solid #666;/*矢印の色*/
height: 30px;
width: 30px;
}
.slick-prev {/*戻る矢印の位置と形状*/
left: -1.5%;
transform: rotate(-135deg);
}
.slick-next {/*次へ矢印の位置と形状*/
right: -1.5%;
transform: rotate(45deg);
}
.hide-area{
display: none;
}
.modaal-close:after, 
.modaal-close:before{
background:#ccc;	
}
.modaal-close:focus:after,
.modaal-close:focus:before,
.modaal-close:hover:after,
.modaal-close:hover:before{
background:#666;
}
#modaal-title{
font-size:1.2rem;
text-align: center;
margin: 0 0 20px 0;
}
.modaal-video .modaal-inner-wrapper{
padding:0;
}
.info-list dl,
.gallery-list{
display: flex;
}
.info-list dt{
margin:0 10px 0 0;
}
.gallery-list li{
margin:0 10px 0 0;
}
.modaal{
max-width: 400px;
max-height: 800px;
}