@CHARSET "UTF-8";

/* COMMON */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,
em,font,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,
tbody,tfoot,thead,tr,th,td{ border:0; font-size:100%; font-style:inherit; font-weight:inherit; margin:0; outline:0; padding:0; vertical-align:baseline; }
body{ font-family:'Hiragino Kaku Gothic Pro', 'Meiryo', sans-serif; margin:0; padding:0; background-color:#f0f8ff; color:#333; line-height:1.6; }
:focus{ outline:0; }
ol,ul{ list-style:none; }
table{ border-collapse:separate; border-spacing:0; }
caption,th,td{ font-weight:normal; text-align:left; }
blockquote:before,blockquote:after,q:before,q:after{ content:""; }
blockquote,q{ quotes:"" ""; }
a img{ border:0; }
figure{ margin:0}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{ display:block; }
h2,h3,h4,h5,h6{ font-size:16px; margin:0 0 5px; }
p,th,td,li,dt,dd,a,figcaption{ font-size:14px; line-height:2; }
p{ margin-bottom:20px; }
p:last-of-type{ margin:0; }
img{ height:auto; max-width:100%; }
label{ font-weight:normal; }
blockquote{ background-color:#EBEDF1; margin:0 0 20px; padding:15px 25px; border-left:5px solid #D3D5D9; }
blockquote,blockquote p{ font-style:italic; line-height:30px; }
blockquote p{ margin-bottom:0!important; }
blockquote cite,blockquote small{ color:#242526; font-size:15px; display:block; line-height:20px; padding-top:15px; }
blockquote em,blockquote i,blockquote cite{ font-style:normal; }
blockquote strong,blockquote b{ font-weight:700; }
a{ text-decoration:none; }
a:hover{ color:#b30322; }
a:active,a:focus{ outline:0; }
select{ padding:6px 8px;  font-size:16px;  background:#FFF;  border:1px solid #193983; }
input[type="text"],input[type="email"],input[type="tel"],textarea{ padding:10px; width:100%; border-radius:5px; background:#FFF; border:1px solid #193983; box-sizing:border-box; }
input[type="file"]{ font-family:"Zen Old Mincho",serif; }
input[type="file"]::file-selector-button{ background:#D9D9D9; border:none; border-radius:3px; padding:8px 1.5em; margin:0 10px 0 0; }
textarea{ height:auto; }
@media only screen and (min-width:768px){
	p,th,td,li,dt,dd,a,figcaption{ font-size:16px; }
	input[type="text"],input[type="email"],input[type="tel"],textarea{ padding:15px 10px; }
}

/* BASE */
.container{ padding:60px 20px; }
.inner{ margin:0 auto; width:100%; max-width:1000px; }
.ttl{ font-size:30px; text-align:center; padding:0 0 10px; color:#193983; margin:0 0 30px; border-bottom:1px solid #187fc3; font-weight:bold; }
.kome{ position:relative; text-align:left ;margin:0; padding:0 0 0 1.2em; }
.kome::after{ position:absolute; top:0; left:0; z-index:2; content:'\203b'; }
@media only screen and (min-width:768px){
	.container{ padding:80px 20px; }
	.ttl{ font-size:35px; margin:0 0 40px; }
}
@media only screen and (min-width:1027px){
	.container{ padding:100px 20px; }
	.ttl{ font-size:40px; margin:0 0 45px; }
}

/* HERO */
.hero{ background:linear-gradient(rgba(25, 25, 25, 0.5), rgba(200, 200, 200, 0.5)), url('../img/top-background.png'); background-size:cover; background-position:center; color:white; text-align:center; padding:100px 0 50px; position:relative; min-height:600px; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.hero-content{ max-width:900px; margin:0 auto; padding-left:0; text-align:center; position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.hero .top-text{ font-size:1.4em; margin-bottom:10px; text-shadow:1px 1px 3px rgba(0,0,0,0.8); font-weight:bold; }
.hero .main-title-img{ display:block; max-width:100%; width:800px; height:auto; margin:0 auto 20px; filter:drop-shadow(3px 3px 6px rgba(0,0,0,0.7)); }
.hero .studio-size{ font-size:1.1em; margin-top:30px; padding:8px 15px; background-color:rgba(38, 76, 145, 0.6); display:inline-block; border-radius:5px; text-shadow:1px 1px 3px rgba(0,0,0,0.5); font-weight:bold; line-height:1.4; }
.hero .subtitle-img{ display:block; max-width:100%; width:800px; height:auto; margin:30px auto 40px; }
.hero-contact-button:hover{ transform:scale(1.05); }
.hero-contact-button .contact-button-img{ width:100%; height:100%; object-fit:contain; filter:drop-shadow(2px 2px 5px rgba(0,0,0,0.6)); }
.fixed-contact-button{ display:none; }
.fixed-contact-button{ position:fixed; right:2rem; bottom:1.5rem; z-index:1000; display:block; width:120px; height:auto; text-decoration:none; transition:transform 0.3s ease-out; }
.fixed-contact-button:hover{ transform:scale(1.1); }
.fixed-contact-button .contact-button-img{ width:100%; height:auto; display:block; filter:drop-shadow(3px 3px 6px rgba(0,0,0,0.5)); }
@media only screen and (min-width:768px){
	.hero .studio-flex{ display:flex; width:100%; justify-content:left; }
}
@media (max-width:900px){
	.hero{ padding:80px 0 40px; min-height:500px; }
	.hero .top-text{ font-size:1.2em; }
	.hero .main-title-img{ width:80%; max-width:500px; }
	.hero .studio-size{ font-size:1em; margin-top:20px; padding:6px 12px; }
	.hero .subtitle-img{ width:90%; max-width:600px; margin-top:25px; margin-bottom:30px; }
	.hero-contact-button{ width:150px; height:150px; margin-top:30px; }
}
@media (max-width:600px){
	.fixed-contact-button{ width:80px; right:10px; bottom:10px; }
}

/* VIDEO */
#video{ background:#FFF; }
#video .ttl{ padding:0; border-bottom:none; margin:0 0 15px; }
.video-container{ position:relative; width:100%; padding-bottom:56.25%; height:0; margin:0 auto; box-shadow:0 4px 10px rgba(0,0,0,0.1); }
.video-container iframe{ position:absolute; top:0; left:0; width:100%; height:100%; border:0; }


/* OFFER */
#offer{ background:url('../img/offer-section-background.png') no-repeat center center; background-size:cover; padding:80px 20px; text-align:center; position:relative; z-index:1; color:black; }
#offer .inner{ display:flex; flex-direction:column; align-items:center; gap:20px; }
#offer img{ max-width:100%; height:auto; display:block; margin:0 auto; }
.offer-img-01{ width:70%; margin-bottom:10px; }
.offer-img-02{ width:90%; }
.offer-img-03{ width:85%; margin-top:20px; }
.offer-img-04{ width:80%; margin-top:20px; }
@media only screen and (min-width:530px){
	#offer br{display:none;}
}
/* FEATURES */
#features{ background:#FFF; }
.features-content{ max-width:900px; margin:0 auto 40px; }
.features-content figure{ margin:0 0 10px; }
.features-content figure:last-of-type{ margin:0; }
.feature-images-row{ display:flex; flex-wrap:wrap; justify-content:center; max-width:820px; margin:auto; }
.feature-images-row figure{ margin:10px 0 0; width:100%; line-height:0; }
.feature-images-row figured{ margin:0; }
.feature-images-row figure img{ width:100%; }
@media only screen and (min-width:768px){
	.features-content figure{ margin:0 0 30px; }
	.feature-images-row figure{ width:calc(50% - 5px); }
	.feature-images-row figure:nth-child(odd){ margin:0 5px 0 0; }
	.feature-images-row figure:nth-child(even){ margin:0 0 0 5px; }
}

/* BACK GROUND */
.background{ background-image:url(../img/offer-section-background.png); background-repeat:no-repeat; background-size:cover; -webkit-background-size:cover; background-position:center; position:relative; }
.background .container{ padding:30px 20px; }
@media only screen and (min-width:768px){
	.background .container{ padding:50px 20px; }
}
@media only screen and (min-width:1027px){
	.background .container{ padding:70px 20px; }
}

/* RENTAL */
.rental-price-table{ width:100%; border-collapse:separate; border-spacing:10px; margin:auto; max-width:820px;}
.rental-price-table th,
.rental-price-table td{ padding:0.5rem 1rem; width:50%; text-align:center; box-sizing:border-box; }
.rental-price-table th{ background:#193983; color:#FFF; text-align:center; }
.rental-price-table th br{ display:none; }
.rental-price-table td { background:#FFF; }
.price-notes{ max-width:800px; margin:20px auto 0; }
.price-notes p{ position:relative; text-align:left ;margin:0; padding:0 0 0 1.2em; }
.price-notes p::after{ position:absolute; top:0; left:0; z-index:2; content:'\203b'; }
@media only screen and (max-width:767px){
	.rental-price-table{ width:100%; border-spacing:0; margin:0; }
	.rental-price-table th,
	.rental-price-table td{ display:block; width:100%; text-align:left; }
	.rental-price-table th{ text-align:left; }
}

/* EQUIPMENT */
.equipment-list{ display:flex; flex-wrap:wrap; justify-content:space-between; text-align:left; list-style:none; padding:0; margin-bottom:30px; }
.equipment-list li{ font-size:20px; font-weight:bold; position:relative; padding:0 0 0 20px; font-size:1.1em; line-height:1.4; margin:10px 0 0; width:100%; box-sizing:border-box; }
.equipment-list li:first-child{ margin:0; }
.equipment-list li::before{ content:''; border-radius:20px; position:absolute; top:3px; left:0; width:15px; height:15px; background:#231815; }
.equipment-gallery-grid{ display:flex; flex-wrap:wrap; justify-content:center; }
.gallery-item-other{ width:calc(50% - 5px); }
.gallery-item-other:nth-child(odd){ margin:10px 5px 0 0; }
.gallery-item-other:nth-child(even){ margin:10px 0 0 5px; }
.gallery-item-other:nth-child(1){ margin:0 5px 0 0; }
.gallery-item-other:nth-child(2){ margin:0 0 0 5px; }
.gallery-caption{ font-size:13px; }
.gallery-image-box{ line-height:0; text-align:center; }
.free-equipment-copy{ margin:30px 0; text-align:center; }
.staff-provision-box{ max-width:800px; margin:auto; background:#193983; padding:20px; border-radius:6px; box-sizing:border-box; }
.staff-image{ line-height:0; margin:0 0 20px; }
.staff-image img{ width:100%; }
.staff-text p{ color:#FFF; font-weight:bold; font-size:18px; }
@media only screen and (min-width:768px){
	.equipment-list li{ font-size:24px; padding:0 0 0 30px; margin:0 0 10px; width:calc(50% - 20px); }
	.equipment-list li:nth-child(odd){ margin:10px 20px 0 0; }
	.equipment-list li:nth-child(even){ margin:10px 0 0 20px; }
	.equipment-list li:nth-child(1){ margin:0 20px 0 0; }
	.equipment-list li:nth-child(2){ margin:0 0 0 20px; }
	.equipment-list li::before{ top:4px; width:20px; height:20px; }
	.gallery-item-other,
	.gallery-item-other:nth-child(odd),
	.gallery-item-other:nth-child(even){ width:calc(25% - 7.4888px); margin:20px 10px 0 0;}
	.gallery-item-other:nth-child(4n){ margin:20px 0 0;}
	.gallery-item-other:nth-of-type(-n+4){ margin:0 10px 0 0;}
	.gallery-item-other:nth-of-type(4){ margin:0 0 0;}
	.gallery-caption{ text-align:center; }
	.staff-content{ display:flex; flex-direction:row-reverse; flex-wrap:wrap; align-items:center; }
	.staff-image{ width:calc(45% - 10px); margin:0 0 0 10px; }
	.staff-text{ width:calc(55% - 10px); margin:0 10px 0 0; }
	.staff-text p{ font-size:20px; }
}
@media only screen and (min-width:1024px){
	.staff-image{ width:calc(45% - 20px); margin:0 0 0 20px; }
	.staff-text{ width:calc(55% - 20px); margin:0 20px 0 0; }
	.staff-text p{ font-size:22px; }
}

/* GALLERY */
.google-map-container{ position:relative; width:100%; padding-bottom:56.25%; height:0; overflow:hidden; }
.google-map-container iframe{ position:absolute; top:0; left:0; width:100%; height:100%; border:0; }

/* VOICE */
.voice-cards-container{ display:flex; gap:20px; max-width:1000px; margin:40px auto 0; justify-content:center; }
.voice-card{ background-color:#FFF; border-radius:15px; padding:15px; box-shadow:0 4px 10px rgba(0, 0, 0, 0.1); text-align:left; flex:1; min-width:280px; box-sizing:border-box; }
.voice-text{ height:180px; background-color:#f8f8f8; border:1px dashed #ccc; padding:15px; margin-bottom:20px; font-size:1em; line-height:1.8; overflow:hidden; position:relative; }
.voice-text::after{ content:' '; width:15px; height:15px; background-color:#3f609e; position:absolute; right:0; bottom:0; clip-path:polygon(100% 0, 0 100%, 100% 100%); }
.voice-footer{ display:flex; align-items:center; justify-content:space-between; }
.client-info{ font-size:.9em; line-height:1.3; }
.client-info span{ font-size:1.5em; font-weight:bold; display:block; margin-bottom:5px; }
.client-avatar{ width:60px;	height:60px; border-radius:50%; }
.client-avatar img{ border-radius:50%; }
@media only screen and (max-width:767px){
	.voice-cards-container{ flex-direction:column; gap:20px; }
	.voice-card{ min-width:unset; width:100%; }
}

/* ACCESS */
#access{ background:#FFF; }
.location-address{ font-size:18px; }
.location-studio{ margin:0 0 20px; }
.location-section,
.location-address{ text-align:center; line-height:1.5; }
.location-section{ margin:0 0 15px; }
@media only screen and (min-width:768px){
	.location-section{ margin:0 0 20px; }
	.location-address{ font-size:20px; line-height:1.5; }
	.location-address br{ display:none; }
}
@media only screen and (min-width:1024px){
	.location-address{ font-size:22px; }
}

/* USER GUIDE */
#guide .ttl{ margin:0 0 40px; }
.guide-notes{ max-width:765px; margin:auto; }
.guide-notes li{ position:relative; line-height:2.2; padding-left:20px; }
.guide-notes li::before{ content:"\25a1"; position:absolute; left:0; top:0; }
@media only screen and (min-width:768px){
	#guide .ttl{ margin:0 0 50px; }
}
@media only screen and (min-width:1024px){
	#guide .ttl{margin:0 0 60px; }
}

/* FAQ */
#faq{ padding:0 20px; }
.qa-box{ margin-bottom:15px; border:none; border-radius:5px; background-color:#fff; }
.qa-box summary,
.qa-box p{ max-width:750px; margin:auto; padding:15px 15px 15px 35px; font-size:14px; }
.qa-box summary{ display:flex; justify-content:space-between; align-items:center; position:relative; cursor:pointer; }
.qa-box summary::before,
.qa-box p::before{position:absolute;left:10px;font-weight:600;font-size:1.3em; }
.qa-box summary::before{ color:#193983; content:"Q"; top:0.5em; }
.qa-box summary::after{ transform:translateY(-25%) rotate(45deg); width:7px; height:7px; margin-left:10px; border-bottom:3px solid #193983; border-right:3px solid #193983; content:''; transition:transform .5s; }
.qa-box[open] summary::after{ transform:rotate(225deg); }
.qa-box p{ position:relative; transform:translateY(-10px); opacity:0; transition:transform .5s, opacity .5s; }
.qa-box[open] p{ transform:none; opacity:1; }
.qa-box p::before{ color:#d83b3b; line-height:1.2; content:"A"; top:1em; }
@media only screen and (min-width:768px){
	.qa-box summary,
	.qa-box p{ font-size:16px; }
}

/* CONTACT */
#contact .ttl{ padding:0; border-bottom:none; margin:0 0 15px; }
.form-card{ background:#FFF; padding:30px 20px; border-radius:10px; box-shadow:6px 6px 10px 0 rgba(0, 0, 0, 0.4); }
.form-group{ margin:0 0 16px; }
.form-group:last-of-type{ margin:0; }
.form-group .req{ color:#e60012; }
.submit-button{ font-size:20px; display:flex; width:240px; height:50px; padding:0; margin:30px auto 0; background-color:#193983; border:1px solid #193983; justify-content:center; align-items:center; color:#FFF; border-radius:60px; cursor:pointer; font-weight:bold; }
@media only screen and (min-width:768px){
	.form-card{ padding:40px 20px; }
	.submit-button{ font-size:25px; width:300px; height:60px; }
}
@media only screen and (min-width:1024px){
	.form-card{ padding:50px; }
	.submit-button{ font-size:30px; }
}

/* FOOTER */
#footer{ background:#193983; padding:30px 20px; }
#footer *{ color:#FFF; }
#footer .f-content{ margin:auto; width:100%; max-width:1000px; }
#footer .co-info p{ text-align:center; }
#footer .co-name{ font-size:22px; font-weight:bold; margin:0; }
#footer .ctc-banner{ height:45px; display:flex; align-items:center; justify-content:center; max-width:280px; margin:30px auto; background-color:white; padding:10px 15px; border-radius:10px; line-height:1.2; }
#footer .ctc-banner p{ color:#193983; text-align:center; margin:0; line-height:1.5; }
#footer .ctc-banner .ctc-banner-text1{ font-size:18px; font-weight:bold; }
#footer .ctc-banner .ctc-banner-text2{ font-size:14px; }
#footer .phone-ctc a{ text-decoration:none; max-width:200px; margin:auto; text-align:center; display:block; }
#footer .copyright{ padding-top:20px; margin:20px auto 0; max-width:1000px; border-top:1px solid #FFF; font-size:0.8em; text-align:center; }
@media only screen and (min-width:768px){
	#footer{ padding:30px 20px 20px; }
	#footer .f-content{ display:flex; justify-content:space-between; align-items:center; height:65px; }
	#footer .co-info p{ text-align:left; font-size:16px; }
	#footer .co-touch{ display:flex; align-items:center; gap:20px; }
	#footer .ctc-banner{ max-width:235px; }
	#footer .phone-ctc a{ max-width:180px; }
}
@media only screen and (min-width:1024px){
	#footer .phone-ctc a{ max-width:320px; }
}

/* FORM */
#page-header{ width:100%; height:120px; margin:70px 0 0; position:relative; background-position:center; background-size:cover; }
#page-header::after { background:rgba(0,0,0,0.5); position:absolute; top:0; left:0; content:''; width:100%; height:100%; }
#page-header .page-header-inner{ display:flex; flex-direction:column; align-items:center; justify-content:center; position:relative; width:100%; height:100%; z-index:1; }
#page-header h1{ color:#FFF; font-size:40px; text-align:center; }
#page-header p{color:#FFF; }
.form-box{ padding:60px 20px; background:#FFF; }
h2.primary{ text-align:center; font-size:1.5em; padding:0 0 10px; margin:0 0 30px; border-bottom:1px solid #DDD; }
.edit-btn{ margin:30px auto 0; padding:0; display:flex; flex-wrap:wrap; justify-content:center; }
.edit-btn li{ list-style:none; width:200px; text-align:center; }
.edit-btn .backbtn{ width:100%; margin:0 0 15px; }
.edit-btn .backbtn,
.edit-btn .sendbtn{ display:block; padding:10px 2em; font-size:1em; color:#fff; border:none; background-color:#193983; transition:.3s; border:0.1rem solid #193983; line-height:1.8; }
.edit-btn .sendbtn{text-decoration:none; }
.edit-btn .backbtn:hover,
.edit-btn .sendbtn:hover{ color:#193983; border:0.1rem solid #193983 ; background-color:#fff; }
.form-tbl{ border-collapse:collapse; width:100%; margin:20px 0 0; }
.form-tbl th,
.form-tbl td{ box-sizing:border-box; }
.form-tbl th{ font-weight:bold; letter-spacing:1px; white-space:nowrap; }
.form-tbl th{ border-bottom:1px dashed #E0E0E0; }
.form-tbl td{ width:80%; border-bottom:1px dashed #E0E0E0; }
.form-tbl th,
.form-tbl td{ padding:15px 0;}
.return-btn a{ display:table; padding:10px 2em; font-size:1em; color:#fff; border:none; background-color:#193983; transition:.3s; border:0.1rem solid #193983; line-height:1.8; margin:auto; }
.return-btn a:hover{ color:#193983; border:0.1rem solid #193983 ; background-color:#fff;}
@media only screen and (min-width:768px){
	#page-header{ height:180px; margin:60px 0 0; }
	#page-header h1{font-size:30px; }
	#page-header p{font-size:16px; }
	.form-box{ padding:80px 20px; }
	.edit-btn li:nth-child(odd){ margin:0 20px 10px 0; }
	.edit-btn li:nth-child(even){ margin:0 0 0 10px; }
	.cnt-txt{ text-align:center; }
}
@media only screen and (min-width:1024px){
	.form-box{ padding:100px 20px; }
}
@media only screen and (max-width:767px){
	.form-tbl th,
	.form-tbl td{ display:block; width:100%; border-top:none; }
	.form-tbl th{ border-bottom:none; padding:10px 0 0; }
	.form-tbl td{ border-bottom:1px dashed #DDD; padding:0 0 10px; }
}