* {
font-feature-settings: "palt";
}
h1 {
position:absolute;
top: 35%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
text-align: center;
width: 27%;
/* z-index: 1000; */
}
h1 img {
width: 100%;
max-width: 320px;
}
h2 {
margin: 0 auto 1em;
width: 40%;
}
#submenu_h2 {
width: 60%;
margin: 1em auto;
}
#submenu_h2 img {
width: 100%;
}

h3 {
margin: 0 35% 3em;
width: 30%;
float: left;
/* clear: left; */
}
h3.top_margin {
margin-top: 3em;
}
h4 {
text-align: center;
margin: 2em auto 0.5em;
font-size: 1.4em;
}
p {
text-align: justify;
}
.openbtn span {
/* background-color: #ffffff; */
}
.cont_bar-top {
border-top: solid 1px #666;
}
.cont_bar-bottom {
/* border-bottom: solid 2px #f6c3d9; */
border-bottom: solid 1px #666;
}
.bg_white {
background-color: #fff;
}
.img_border {
border: 1px solid #f1f1f1;
}
/* ##############　TOPページコンテンツエリア　############## */
#container_top {
background-color: #fff;
padding: 0 0 2em;
margin: 0 auto 2em;
border-radius: 20px 20px 0 0;
overflow: hidden;
}
#joyful {
margin: 0 auto 4em;
float: left;
}
#main_copy {
width: 90%;
margin: 0 auto 2em;
text-align: center;
font-size: 1.4em;
line-height: 1.6em;
font-family: '游明朝','Yu Mincho',YuMincho,'Hiragino Mincho Pro',serif;　
}
#submenu {
width: 90%;
margin: 1em auto;
}
#submenu li {
width: 25%;
float: left;
padding: 0 2%;
}
/* ############## article #rental ############## */
#container_rental {
margin: 2em auto;
padding: 2em 0 0;
background-color: #f6f5f0;
border-radius: 20px;
overflow: hidden;
/* float: left; */
}
.cont_full {
position: relative;
margin: 0 auto 1em;
width: 100%;
float: left;
}
.cont_full1 {
position: relative;
margin: 0 auto 4em;
width: 100%;
float: left;
}
.brand_copy {
color: #684039;
padding: 0em 3%;
font-weight: bold;
font-size: 1.2em;
line-height: 1.2em;
font-feature-settings: "palt";
margin: 1em auto 0em;
padding-left: 1.4em;
background-image: url("../images/brand_copy-before.svg");
background-size: 1.0em;
background-position: 0 45%;
letter-spacing: 0.05em;
}
.main_copy {
color: #684039;
font-weight: bold;
font-size: 1.2em;
line-height: 1.2em;
font-feature-settings: "palt";
margin: 1em auto 0.5em;
}
.copy {
width: 95%;
margin: 0 auto 1em;
}
.copy_studio {
width: 95%;
margin: 0 auto;
}
.long_banner {
position: relative;
width: 100%;
}
.long_banner .btn {
position: absolute;
border-radius: 0;
bottom: 0%;
right: 0%;
border: 0px;
color: #fff;
background-color: #b4a65d;
}
.cont_half {
padding: 1.5% 1.25%;
margin: 0 auto 0;
width: 50%;
float: left;
}
.cont_half .copy {
min-height: 10em;
}
.cont_full2 .copy, .cont_full3 .copy {
width: 55%;
float: left;
padding: 1%;
}
.cont_full3 .copy_studio {
width: 55%;
float: left;
padding: 0 5%;
}
.brand_copy-long {
width: 90%;
font-size: 1.4em;
line-height: 1.4em;
color: #b3004f;
margin: 3em auto 1em;
}
#studio_banner {
width: 96%;
margin: 30px 2%;
float: left;
}
#studio_banner li {
position: relative;
float: left;
width: 48%;
margin: 1%;
}
#studio_banner li .btn {
position: absolute;
border-radius: 0;
bottom: 0%;
right: 0%;
border: 2px #fff solid;
color: #fff;
}
/* ############## article #bridal ############## */
#container_bridal {
margin: 2em auto;
padding: 2em 0 0;
background-color: #f7e9e9;
border-radius: 20px;
overflow: hidden;
/* float: left; */
}
.copy_bridal {
width: 95%;
margin: 1em auto 1em;
}
#container_studio {
background-color: #fff;
margin: 2em auto;
padding: 2em 0 0;
border-radius: 20px;
overflow: hidden;
}
#container_kitsuke {
background-color: #fffeea;
margin: 2em auto;
padding: 2em 0 0;
border-radius: 20px;
overflow: hidden;
}
#jfc_area {
width: 100%;
margin: 5em auto;
}
#jfc_area table {
width: 100%;
border-collapse: collapse;
}
#jfc_area table td, th {
border: 1px solid #595959;
}
td, th {
padding: 10px;
width: 50%;
background-color: #fff;
text-align: center;
}
th {
background-color: #fadbe8;
}
.note_left {
width: 100%;
text-align: left;
margin: 10px auto;
color: #666;
float: left;
}
.note_right {
text-align: right;
margin-top: 5px;
color: #666;
}
.link_bar {
border-bottom: 2px solid #aaa;
width: auto;
}
/* スマホ */
@media screen and (max-width:960px){
h1 {
top: 30%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
text-align: center;
width: 50%;
}
#submenu_h2 {
width: 80%;
margin: 1em auto 0em;
}
#container_top section {
width: 95%;
}
#main_copy {
font-size: 1.4em;
line-height: 1.6em;
}
#topics {
margin: -20% auto 0;
}
#concept {
background-position: 55% 20%;
}
#concept .catch {
font-size: 1.4em;
line-height: 1.4em;
width: 90%;
margin: 40% auto 3%;
}
#concept .more {
padding: 5%;
background-color: rgba(255,255,255,0.6);
font-size: 1.2em;
line-height: 1.8em;
font-weight: 400;
width: 90%;
margin: auto;
}
/* ############## article #project ############## */
#project section {
width: 70%;
/* max-width: 250px; */
}
.note_left {
font-size: 0.9em;
line-height: 1.2em;
}
.note_right {
font-size: 0.9em;
}
}
@media screen and (max-width:900px){
h2 {
margin: 0 auto;
width: 50%;
}

h3 {
margin: 1em 25%;
width: 50%;
float: left;
/* clear: left; */
}
#main_copy {
font-size: 1.0em;
line-height: 1.6em;
}
#submenu {
width: 95%;
}
#submenu li {
width: 25%;
float: left;
padding: 0 1%;
}
.cont_half .copy {
min-height: inherit;
width: 97.5%;
}
.cont_half {
width: 100%;
}
.copy {
margin: 1% auto;
min-height: auto;
}
.copy_note {
margin: 0.5em auto;
width: 95%;
}
.cont_full2 .copy {
width: 55%;
float: left;
padding: 0% 3%;
margin: 0 auto;
}
.cont_full3 .copy {
width: 53%;
float: left;
padding: 1% 3%;
margin: 0em auto;
}
.brand_copy {
/* margin: 0 0 0.5em; */
font-size: 1.4em;
line-height: 1.3em;
}
.cont_full2 .brand_copy {
margin: 1%;
}
.cont_full2 .copy {
padding: 0 2% 0 2% !important;
}
.cont_full3 .brand_copy,
.cont_full4 .brand_copy {
font-size: 1.4em;
margin: 1% 2%;
clear: left;
}
#joyful .brand_copy,
#container_studio .brand_copy {
/* margin: 1em 0% 0.5em; */
}
.cont_bar-top {
border-top: solid 1px #666;
}
.half_banner {
margin: 1% 0 1% 1%;
}
.half_bannerR {
margin: 1% 1% 1% 0%;
}
.cont_full3 .half_bannerR {
margin: 1% 1% 1% 2%;
}
.half_banner .btn,
.half_bannerR .btn,
#studio_banner li .btn {
padding: 2px;
width: 80%;
}
.half_banner .btn a span,
.half_bannerR .btn a span,
#studio_banner li .btn a span {
font-size: 12px;
text-align: right;
}
.half_banner .btn .arrow,
.half_bannerR .btn .arrow,
#studio_banner li .btn .arrow {
top: 45%;
left: -15px;
width: 30px;
transition: all 0.4s;
}
.btn:hover .arrow {
left: -5%;
}
.img_border {
border: 1px solid #f1f1f1;
}
#jfc_area {
margin: 2em auto;
}
#jfc_area h4 {
margin: 1em auto 0.5em;
}
}