@charset "UTF-8";
/* Scss Document */
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box; }
a {
color: inherit; }
a:hover {
opacity: 0.7 !important;
transition: 0.5s; }
img {
max-width: 100%;
width: 100%; }
html, body {
font-family: "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho,"HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
font-size: 62.5%;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; }
body {
font-size: 1.6rem;
font-weight: 300;
line-height: 1.75;
color: #000000;
font-feature-settings: "palt";
animation: fadeIn 2s ease 0s 1 normal;
-webkit-animation: fadeIn 2s ease 0s 1 normal;
display: flex;
flex-direction: column;
min-height: 100vh; }
@media screen and (max-width: 768px) {
body {
font-size: 1.4rem; } }
body.add_overray {
overflow: hidden; }
svg {
fill: currentColor; }
.sp {
display: none; }
@media screen and (max-width: 768px) {
.sp {
display: block !important; } }
.pc {
display: block; }
@media screen and (max-width: 768px) {
.pc {
display: none !important; } }
.bodoni {
font-family: bodoni-urw, serif;
font-weight: 500;
font-style: normal; }
.bodoniBold {
font-family: bodoni-urw, serif;
font-weight: 700;
font-style: normal; }
.calson {
font-family: big-caslon-fb, serif;
font-weight: 400;
font-style: normal; }
@-webkit-keyframes sk-scaleout {
0% {
-webkit-transform: scale(0.7); }
100% {
-webkit-transform: scale(0.6);
opacity: 0; } }
@keyframes sk-scaleout {
0% {
-webkit-transform: scale(0.7);
transform: scale(0.7); }
100% {
-webkit-transform: scale(0.6);
transform: scale(0.6);
opacity: 0; } }
.animation_area {
position: relative; }
.dummy_area {
position: absolute;
left: 0;
top: 0; }
.dummy_area3 {
position: absolute;
left: 0;
top: 0; }
.img_area {
animation: key1 1s; }
@keyframes key1 {
0% {
opacity: 0; }
50% {
opacity: 0; }
51% {
opacity: 1; }
100% {
opacity: 1; } }
.dummy_area {
animation: key2 1s;
display: inline-block;
height: 100%;
background-color: #fff;
opacity: 0.5;
-webkit-transform: rotate(0.0001deg);
transform: rotate(0.0001deg);
outline: 1px solid transparent; }
@keyframes key2 {
0% {
left: 0;
width: 0px;
height: 100%; }
50% {
left: 0;
width: 100.1%;
height: 100%; }
100% {
left: 100%;
width: 0px;
height: 100%; } }
.dummy_area3 {
animation: key3 1s;
display: inline-block;
height: 100%;
background-color: #000;
opacity: 0.8;
-webkit-transform: rotate(0.0001deg);
transform: rotate(0.0001deg);
outline: 1px solid transparent; }
@keyframes key3 {
0% {
left: 0;
width: 0px;
height: 100%; }
50% {
left: 0;
width: 100.1%;
height: 100%; }
100% {
left: 100%;
width: 0px;
height: 100%; } }
@keyframes fadeIn {
0% {
opacity: 0; }
100% {
opacity: 1; } }
@-webkit-keyframes fadeIn {
0% {
opacity: 0; }
100% {
opacity: 1; } }
.fadein {
opacity: 0.5;
transform: translate(0, 40px);
transition: all 500ms; }
@media screen and (max-width: 768px) {
.fadein {
transform: translate(0, 30px); } }
.fadein.scrollin {
opacity: 1;
transform: translate(0, 0); }
@keyframes fadeIn2 {
0% {
opacity: 0; }
100% {
opacity: 1; } }
@-webkit-keyframes fadeIn2 {
0% {
opacity: 0; }
100% {
opacity: 1; } }
.fadein2 {
opacity: 0;
transform: translate(0, 0);
transition: all 2s;
transition-delay: 1000ms; }
.fadein2.scrollin {
opacity: 1;
transform: translate(0, 0); }
header {
position: fixed;
height: 80px;
padding: 0;
width: 100%;
top: 0;
left: 0;
z-index: 9999;
transition: .7s;
color: #fff; }
@media screen and (max-width: 768px) {
header {
height: 50px; } }
header #gnav_btn {
position: absolute;
width: 80px;
height: 80px;
top: 0;
left: 0;
z-index: 99999; }
@media screen and (max-width: 768px) {
header #gnav_btn {
width: 50px;
height: 50px; } }
header #gnav_btn:hover {
transition: 0.5s; }
header #gnav_btn.open span {
animation: nav_anim1 .5s forwards; }
header #gnav_btn.open span::after {
animation: nav_anim2 .5s forwards; }
header #gnav_btn.open span::before {
animation: nav_anim3 .5s forwards; }
header nav {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
background-color: #fff;
z-index: 1000;
overflow-y: scroll;
color: #000000;
height: 100%; }
@media screen and (max-width: 768px) {
header nav {
bottom: 0; } }
header nav .nav_list {
display: flex;
width: 80%;
margin: 180px auto 60px;
justify-content: space-between; }
@media screen and (max-width: 768px) {
header nav .nav_list {
width: 100%;
display: block;
text-align: center;
margin: 90px auto 60px; } }
@media screen and (max-width: 768px) {
header nav .nav_list li {
margin-bottom: 30px; } }
header nav .nav_list li a {
border-bottom: 2px solid #000;
padding-bottom: 5px;
font-size: 3rem; }
header nav .allitem {
color: #000 !important; }
header nav .allitem h2 {
position: static;
margin-bottom: 20px; }
@media screen and (max-width: 768px) {
header nav .allitem h2 {
max-width: 212px; } }
header nav .allitem ul li {
width: 19%; }
@media screen and (max-width: 768px) {
header nav .allitem ul li {
width: 49%; }
header nav .allitem ul li:nth-child(2n) {
border-right: 0; } }
header nav .allitem ul li:nth-child(4n) {
border-right: 1px dashed #000; }
@media screen and (max-width: 768px) {
header nav .allitem ul li:nth-child(4n) {
border-right: none; } }
header nav .allitem ul li:nth-child(5n) {
border-right: 0; }
@media screen and (max-width: 768px) {
header nav .allitem ul li:nth-child(5n) {
border-right: 1px dashed #000; } }
header nav #nav_back {
background: #666;
color: #fff;
text-align: center;
padding: 35px 0 60px; }
header nav #nav_back a {
margin-bottom: 25px;
display: block; }
header nav #nav_back a img {
width: 158px; }
header nav #nav_back .outside {
padding: 10px 50px;
border: 1px solid #fff;
margin: 0 auto;
display: block;
width: 20%;
font-size: 1.4rem; }
@media screen and (max-width: 768px) {
header nav #nav_back .outside {
width: 60%; } }
header #gnav_inter {
position: absolute;
width: 295px;
height: 80px;
top: 0;
right: 0;
z-index: 99999; }
@media screen and (max-width: 768px) {
header #gnav_inter {
width: 185px;
height: 50px; } }
header #gnav_inter:hover {
transition: 0.5s; }
#intro .inner {
margin: 0 auto;
padding: 65px 0 120px;
max-width: 1100px;
width: 88%;
text-align: center;
position: relative; }
@media screen and (max-width: 768px) {
#intro .inner {
padding: 60px 0 160px; } }
#intro .inner .intro_head {
position: absolute;
font-size: 3rem;
left: 50%;
top: 110px;
-moz-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translate(-50%);
/*位置調整*/
padding: 10px 0;
border-top: 1px solid #000;
border-bottom: 1px solid #000; }
@media screen and (max-width: 768px) {
#intro .inner .intro_head {
position: static;
-moz-transform: none;
-webkit-transform: none;
-ms-transform: none;
transform: none;
margin-bottom: 35px; } }
#intro .inner ul {
display: flex;
justify-content: space-between;
margin-bottom: 60px;
padding-bottom: 60px;
border-bottom: 1px solid #000;
font-size: 1.4rem; }
@media screen and (max-width: 768px) {
#intro .inner ul {
display: block;
margin-bottom: 30px;
padding-bottom: 30px; } }
#intro .inner ul li {
width: 44%;
text-align: center; }
@media screen and (max-width: 768px) {
#intro .inner ul li {
width: 100%;
margin-bottom: 30px; } }
#intro .inner ul li h2.match5 img {
margin: 20px auto; }
@media screen and (max-width: 768px) {
#intro .inner ul li h2.match5 img {
margin: 0 auto; } }
#intro .inner ul li h2 img {
width: auto; }
#intro .inner ul li p {
margin-top: 20px;
margin-bottom: 0; }
#intro .inner p {
margin-bottom: 30px;
line-height: 2;
font-size: 1.6rem; }
#intro .inner p:last-child {
margin-bottom: 0; }
@media screen and (max-width: 768px) {
#intro .inner p {
margin-bottom: 40px;
font-size: 1.4rem; } }
#allitems {
position: relative;
margin-bottom: 60px; }
@media screen and (max-width: 768px) {
#allitems {
margin-bottom: 25px; } }
#allitems::before {
position: absolute;
top: -62px;
right: 150px;
content: "";
background: url("../img/top/txt_allitems.png");
background-size: cover;
width: 287px;
height: 94px;
z-index: 999; }
@media screen and (max-width: 768px) {
#allitems::before {
top: -58px;
right: 6%;
content: "";
width: 179px;
height: 64px;
background: url("../img/top/txt_allitems_sp.png");
background-size: cover; } }
#allitems .inner .item_list {
display: flex;
flex-wrap: wrap;
justify-content: center; }
#allitems .inner .item_list li {
width: 25%;
position: relative;
margin-bottom: 8px; }
@media screen and (max-width: 960px) {
#allitems .inner .item_list li {
width: 33.333333333333%;
margin-bottom: 0; } }
@media screen and (max-width: 768px) {
#allitems .inner .item_list li {
width: 50%;
margin-bottom: 0; } }
#allitems .inner .item_list li a {
display: block; }
#allitems .inner .item_list li img {
position: relative; }
#allitems .inner .item_list li .item_list_name {
position: absolute;
top: 39%;
left: 50%;
-moz-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translate(-50%);
/*位置調整*/
text-align: center; }
@media screen and (max-width: 768px) {
#allitems .inner .item_list li .item_list_name {
top: 30%; } }
#allitems .inner .item_list li .item_list_name img {
max-width: 107px; }
@media screen and (max-width: 768px) {
#allitems .inner .item_list li .item_list_name img {
max-width: 86px; } }
#allitems .inner .item_list li .item_list_name h2 {
font-size: 1.4rem;
color: #fff;
letter-spacing: 2px; }
@media screen and (max-width: 768px) {
#allitems .inner .item_list li .item_list_name h2 {
font-size: 1rem; } }
#allitems .inner .item_list li .item_list_button {
position: absolute;
bottom: 0;
left: 50%;
-moz-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translate(-50%);
/*位置調整*/
text-align: center;
padding: 8px 25px 5px;
color: #fff;
font-size: 1.4rem;
background: #000;
display: block; }
#gallery .gallery_main .animation_area {
background: none; }
#gallery .gallery_main .pc {
background: url("../img/top/img_gallery_main.jpg") center no-repeat;
background-size: cover; }
#gallery .gallery_main .sp {
background: url("../img/top/img_gallery_main_sp.jpg") center no-repeat;
background-size: cover; }
#gallery .gallery_inner {
position: relative;
width: 100%; }
#gallery .gallery_inner h2 {
letter-spacing: 2px; }
#gallery .gallery_inner h2::before {
content: "";
background: #000;
width: 25px;
height: 1px;
left: 0;
top: -15px;
position: absolute; }
@media screen and (max-width: 768px) {
#gallery .gallery_inner h2 {
margin-top: 50px;
position: relative; } }
#gallery .gallery_inner p {
font-size: 1.1rem;
margin-top: 20px;
letter-spacing: 2px; }
@media screen and (max-width: 768px) {
#gallery .gallery_inner {
position: static; } }
#gallery .gallery_inner .gallery_inner_sub img {
max-width: 100%; }
@media screen and (max-width: 768px) {
#gallery #gallery01 {
margin-top: 35px; } }
#gallery #gallery01 .gallery_inner_main {
position: absolute;
top: 0;
right: 0;
width: 43.6%; }
@media screen and (max-width: 768px) {
#gallery #gallery01 .gallery_inner_main {
width: 88%;
margin: 0 auto;
position: static; } }
#gallery #gallery01 .gallery_inner_sub {
position: absolute;
left: 10%;
top: 0;
width: 37.2%; }
@media screen and (max-width: 768px) {
#gallery #gallery01 .gallery_inner_sub {
width: 100%;
position: static; } }
#gallery #gallery01 .gallery_inner_sub .gallery_inner_txt {
position: absolute;
left: 0;
bottom: 45.9%; }
@media screen and (max-width: 768px) {
#gallery #gallery01 .gallery_inner_sub .gallery_inner_txt {
width: 88%;
margin: 0 auto;
position: relative; } }
@media screen and (max-width: 768px) {
#gallery #gallery01 .gallery_inner_sub .gallery_inner_img {
width: 88%;
margin: 0 auto;
position: relative;
text-align: right; } }
#gallery #gallery01 .gallery_inner_sub .sub1 {
position: absolute;
right: 0;
bottom: 39.9%;
width: 46.9%; }
@media screen and (max-width: 768px) {
#gallery #gallery01 .gallery_inner_sub .sub1 {
width: 50%;
position: static;
margin-top: 10px; } }
#gallery #gallery01 .gallery_inner_sub .sub2 {
position: absolute;
bottom: 0;
left: 0;
width: 100%; }
@media screen and (max-width: 768px) {
#gallery #gallery01 .gallery_inner_sub .sub2 {
position: static;
margin-top: 5px; } }
#gallery #gallery02 {
margin-top: 140px; }
@media screen and (max-width: 768px) {
#gallery #gallery02 {
margin-top: 100px; } }
#gallery #gallery02 .gallery_inner_main {
width: 80%;
margin: 0 auto; }
@media screen and (max-width: 768px) {
#gallery #gallery02 .gallery_inner_main {
width: 100%; } }
#gallery #gallery02 .gallery_inner_sub {
position: relative;
width: 80%;
margin: 20px auto 0; }
@media screen and (max-width: 768px) {
#gallery #gallery02 .gallery_inner_sub {
margin: 30px auto 0; } }
#gallery #gallery02 .gallery_inner_sub .gallery_inner_txt {
position: absolute;
bottom: 0;
left: 52.9%; }
@media screen and (max-width: 768px) {
#gallery #gallery02 .gallery_inner_sub .gallery_inner_txt {
position: static;
margin: 0 auto; } }
#gallery #gallery02 .gallery_inner_sub .gallery_inner_img {
position: relative; }
@media screen and (max-width: 768px) {
#gallery #gallery02 .gallery_inner_sub .gallery_inner_img {
position: static;
margin: 0 auto;
text-align: left; } }
#gallery #gallery02 .gallery_inner_sub .sub1 {
position: relative;
width: 32%;
left: 7%; }
@media screen and (max-width: 768px) {
#gallery #gallery02 .gallery_inner_sub .sub1 {
position: static;
width: 50%; } }
#gallery #gallery02 .gallery_inner_sub .sub2 {
position: absolute;
width: 47.1%;
right: 0; }
@media screen and (max-width: 768px) {
#gallery #gallery02 .gallery_inner_sub .sub2 {
position: static;
margin-top: 5px;
width: 100%; } }
#gallery #gallery03 {
margin-top: 140px; }
@media screen and (max-width: 768px) {
#gallery #gallery03 {
margin-top: 100px; } }
#gallery #gallery03 .gallery_inner_main {
width: 90%; }
@media screen and (max-width: 768px) {
#gallery #gallery03 .gallery_inner_main {
width: 100%; } }
#gallery #gallery03 .gallery_inner_sub {
position: relative;
width: 100%;
margin: 20px auto 0; }
@media screen and (max-width: 768px) {
#gallery #gallery03 .gallery_inner_sub {
margin: 30px auto 0;
width: 80%; } }
#gallery #gallery03 .gallery_inner_sub .gallery_inner_txt {
position: absolute;
bottom: 30%;
right: 10%; }
@media screen and (max-width: 768px) {
#gallery #gallery03 .gallery_inner_sub .gallery_inner_txt {
position: static;
margin: 0 auto; } }
#gallery #gallery03 .gallery_inner_sub .gallery_inner_img {
position: relative; }
@media screen and (max-width: 768px) {
#gallery #gallery03 .gallery_inner_sub .gallery_inner_img {
position: static;
margin: 0 auto;
text-align: left; } }
#gallery #gallery03 .gallery_inner_sub .sub1 {
position: relative;
width: 40.3%;
left: 30%; }
@media screen and (max-width: 768px) {
#gallery #gallery03 .gallery_inner_sub .sub1 {
position: static;
width: 100%; } }
#gallery #gallery04 {
margin-top: 140px; }
@media screen and (max-width: 768px) {
#gallery #gallery04 {
margin-top: 100px; } }
#gallery #gallery04 .gallery_inner_main {
position: relative;
top: 0;
left: 0;
width: 56%; }
@media screen and (max-width: 768px) {
#gallery #gallery04 .gallery_inner_main {
width: 90%;
position: static; } }
#gallery #gallery04 .gallery_inner_sub {
position: absolute;
right: 10%;
top: 0;
width: 29.5%; }
@media screen and (max-width: 768px) {
#gallery #gallery04 .gallery_inner_sub {
width: 100%;
position: static; } }
#gallery #gallery04 .gallery_inner_sub .gallery_inner_txt {
position: absolute;
left: 0;
bottom: 89.5%; }
@media screen and (max-width: 768px) {
#gallery #gallery04 .gallery_inner_sub .gallery_inner_txt {
width: 80%;
margin: 0 auto;
position: relative; } }
@media screen and (max-width: 768px) {
#gallery #gallery04 .gallery_inner_sub .gallery_inner_img {
width: 80%;
margin: 30px auto 0;
position: relative;
text-align: right; } }
#gallery #gallery04 .gallery_inner_sub .sub1 {
position: absolute;
right: 0;
bottom: 29.8%;
width: 100%; }
@media screen and (max-width: 768px) {
#gallery #gallery04 .gallery_inner_sub .sub1 {
width: 80%;
position: static;
margin-top: 10px; } }
#gallery #gallery04 .gallery_inner_sub .sub2 {
position: absolute;
bottom: 0;
left: 0;
width: 100%; }
@media screen and (max-width: 768px) {
#gallery #gallery04 .gallery_inner_sub .sub2 {
position: static;
margin-top: 5px;
width: 80%; } }
#gallery #gallery05 {
margin-top: 140px; }
@media screen and (max-width: 768px) {
#gallery #gallery05 {
margin-top: 100px; } }
#gallery #gallery05 .gallery_inner_main {
width: 80%;
margin: 0 auto; }
@media screen and (max-width: 768px) {
#gallery #gallery05 .gallery_inner_main {
width: 100%; } }
#gallery #gallery05 .gallery_inner_sub {
position: relative;
width: 80%;
margin: 0 auto 0; }
#gallery #gallery05 .gallery_inner_sub .gallery_inner_txt {
position: relative;
bottom: 0;
right: 0;
height: 130px; }
#gallery #gallery05 .gallery_inner_sub .gallery_inner_txt h2 {
position: absolute;
right: 0;
top: 50px; }
@media screen and (max-width: 768px) {
#gallery #gallery05 .gallery_inner_sub .gallery_inner_txt h2 {
position: static; } }
#gallery #gallery05 .gallery_inner_sub .gallery_inner_txt p {
position: absolute;
right: 0;
bottom: 0; }
@media screen and (max-width: 768px) {
#gallery #gallery05 .gallery_inner_sub .gallery_inner_txt p {
position: static; } }
@media screen and (max-width: 768px) {
#gallery #gallery05 .gallery_inner_sub .gallery_inner_txt {
position: static;
margin: 0 auto; } }
#gallery #gallery05 .gallery_inner_sub .gallery_inner_img {
width: 80%;
margin: 0 auto;
margin-bottom: 25px; }
@media screen and (max-width: 768px) {
#gallery #gallery05 .gallery_inner_sub .gallery_inner_img {
width: 100%;
margin-bottom: 10px; } }
#gallery #gallery05 .gallery_inner_sub .sub1 {
width: 100%; }
#gallery #gallery06 {
margin-top: 140px; }
@media screen and (max-width: 768px) {
#gallery #gallery06 {
margin-top: 40px; } }
#gallery #gallery06 .gallery_inner_main {
position: relative;
top: 0;
width: 61.3%;
margin-left: 38.7%; }
@media screen and (max-width: 768px) {
#gallery #gallery06 .gallery_inner_main {
width: 100%;
position: static;
margin: 10px auto 0; } }
#gallery #gallery06 .gallery_inner_main .gallery_inner_txt {
position: absolute;
left: 10%;
bottom: 0; }
@media screen and (max-width: 768px) {
#gallery #gallery06 .gallery_inner_main .gallery_inner_txt {
width: 80%;
margin: 0 auto;
position: static; } }
#gallery #gallery06 .gallery_inner_sub {
position: absolute;
left: 0;
top: 0;
width: 36.6%; }
@media screen and (max-width: 768px) {
#gallery #gallery06 .gallery_inner_sub {
width: 100%;
position: static; } }
@media screen and (max-width: 768px) {
#gallery #gallery06 .gallery_inner_sub .gallery_inner_img {
width: 80%;
margin: 0 auto;
text-align: right; } }
#gallery #gallery06 .gallery_inner_sub .sub1 {
position: relative;
left: 0;
top: 0;
width: 100%; }
@media screen and (max-width: 768px) {
#gallery #gallery06 .gallery_inner_sub .sub1 {
width: 100%;
position: static;
margin: 0 auto; } }
#gallery #gallery06 .gallery_inner_sub .sub2 {
position: relative;
margin-left: 50%;
width: 50%;
margin-top: 20px; }
@media screen and (max-width: 768px) {
#gallery #gallery06 .gallery_inner_sub .sub2 {
position: static;
margin-top: 5px;
width: 50%; } }
#gallery #gallery07 {
width: 80%;
margin: 140px auto 130px; }
@media screen and (max-width: 768px) {
#gallery #gallery07 {
margin-top: 100px;
width: 100%;
margin-left: 10%;
margin-bottom: 60px; } }
#gallery #gallery07 .gallery_inner_main {
position: relative;
top: 0;
left: 0;
width: 63.3%; }
@media screen and (max-width: 768px) {
#gallery #gallery07 .gallery_inner_main {
width: 90%;
position: static; } }
#gallery #gallery07 .gallery_inner_sub {
position: absolute;
right: 0;
top: 0;
width: 25%; }
@media screen and (max-width: 768px) {
#gallery #gallery07 .gallery_inner_sub {
width: 100%;
position: static; } }
#gallery #gallery07 .gallery_inner_sub .gallery_inner_txt {
position: absolute;
left: 0;
bottom: 7%; }
@media screen and (max-width: 768px) {
#gallery #gallery07 .gallery_inner_sub .gallery_inner_txt {
width: 100%;
margin: 0 auto;
position: relative; } }
@media screen and (max-width: 768px) {
#gallery #gallery07 .gallery_inner_sub .gallery_inner_img {
width: 58.6%;
margin: 10px 10% 0 0;
position: relative;
text-align: left; } }
#gallery #gallery07 .gallery_inner_sub .sub1 {
position: absolute;
right: 0;
bottom: 47%;
width: 100%; }
@media screen and (max-width: 768px) {
#gallery #gallery07 .gallery_inner_sub .sub1 {
width: 80%;
position: static;
margin-top: 10px; } }
#gallery #gallery07 .gallery_inner_sub .sub2 {
position: absolute;
bottom: 21.75%;
left: 0;
width: 100%; }
@media screen and (max-width: 768px) {
#gallery #gallery07 .gallery_inner_sub .sub2 {
position: static;
margin-top: 5px;
width: 80%; } }
#product .product_main .animation_area {
background: none; }
#product .product_main .pc {
background: url("../img/top/img_product_main.jpg") center no-repeat;
background-size: cover; }
#product .product_main .sp {
background: url("../img/top/img_product_main_sp.jpg") center no-repeat;
background-size: cover; }
#product .product_detail_inner {
max-width: 1100px;
margin: 50px auto 0; }
#product .product_detail_inner a {
display: block; }
#product .product_detail_inner .product_detail_img {
position: relative; }
#product .product_detail_inner .product_detail_img img {
max-width: 62%; }
@media screen and (max-width: 768px) {
#product .product_detail_inner .product_detail_img img {
max-width: 88%; } }
#product .product_detail_inner .product_detail_img:hover h3 {
border-bottom: 1px solid; }
@media screen and (max-width: 768px) {
#product .product_detail_inner .product_detail_img:hover h3 {
padding-bottom: 10px; } }
#product .product_detail_inner .product_detail_img .product_detail_imgIn {
position: absolute;
left: 56.6%;
bottom: 8%; }
@media screen and (max-width: 768px) {
#product .product_detail_inner .product_detail_img .product_detail_imgIn {
position: static;
width: 88%;
margin: 0 auto; } }
#product .product_detail_inner .product_detail_img .product_detail_imgIn h3 {
font-size: 4rem;
position: absolute;
top: -200%;
left: 220px;
line-height: 1; }
@media screen and (max-width: 768px) {
#product .product_detail_inner .product_detail_img .product_detail_imgIn h3 {
position: static;
font-size: 3rem;
text-align: right;
margin-top: 30px; } }
#product .product_detail_inner .product_detail_img .product_detail_imgIn h3::before {
content: url("../img/top/ico_arrow_right.png");
position: absolute;
left: -220px;
top: 0; }
@media screen and (max-width: 768px) {
#product .product_detail_inner .product_detail_img .product_detail_imgIn h3::before {
right: 70px; } }
@media screen and (max-width: 768px) {
#product .product_detail_inner .product_detail_img .product_detail_imgIn dl {
text-align: left; } }
#product .product_detail_inner .product_detail_img .product_detail_imgIn dl dt {
letter-spacing: 2px; }
#product .product_detail_inner .product_detail_img .product_detail_imgIn dl dt::before {
content: "";
background: #000;
width: 25px;
height: 1px;
left: 0;
top: -15px;
position: absolute; }
@media screen and (max-width: 768px) {
#product .product_detail_inner .product_detail_img .product_detail_imgIn dl dt {
margin-top: 50px;
position: relative; } }
#product .product_detail_inner .product_detail_img .product_detail_imgIn dl dd {
font-size: 1.1rem;
margin-top: 20px;
letter-spacing: 2px; }
#product .product_detail_inner .product_detail_txt {
display: flex;
margin: 50px auto;
line-height: 2; }
@media screen and (max-width: 768px) {
#product .product_detail_inner .product_detail_txt {
display: block;
width: 88%;
margin: 0 auto 35px; } }
#product .product_detail_inner .product_detail_txt p {
width: 37%;
margin-right: 50px;
display: block;
font-size: 1.4rem; }
@media screen and (max-width: 768px) {
#product .product_detail_inner .product_detail_txt p {
margin-right: 0;
margin-top: 20px;
width: 100%; } }
#product .product_detail_right .product_detail_inner {
text-align: right; }
#product .product_detail_right .product_detail_inner a {
display: block; }
#product .product_detail_right .product_detail_inner .product_detail_img {
position: relative; }
#product .product_detail_right .product_detail_inner .product_detail_img img {
max-width: 62%; }
@media screen and (max-width: 768px) {
#product .product_detail_right .product_detail_inner .product_detail_img img {
max-width: 88%; } }
#product .product_detail_right .product_detail_inner .product_detail_img:hover h3 {
border-bottom: 1px solid; }
@media screen and (max-width: 768px) {
#product .product_detail_right .product_detail_inner .product_detail_img:hover h3 {
padding-bottom: 10px; } }
#product .product_detail_right .product_detail_inner .product_detail_img .product_detail_imgIn {
position: absolute;
left: 25%;
bottom: 8%; }
#product .product_detail_right .product_detail_inner .product_detail_img .product_detail_imgIn.p08 {
left: 20%; }
@media screen and (max-width: 768px) {
#product .product_detail_right .product_detail_inner .product_detail_img .product_detail_imgIn {
position: static;
width: 88%;
margin: 0 auto; } }
#product .product_detail_right .product_detail_inner .product_detail_img .product_detail_imgIn h3 {
font-size: 4rem;
position: absolute;
top: -200%;
left: -50%;
line-height: 1; }
#product .product_detail_right .product_detail_inner .product_detail_img .product_detail_imgIn h3.p04 {
left: -30%; }
#product .product_detail_right .product_detail_inner .product_detail_img .product_detail_imgIn h3.p08 {
left: -10%; }
@media screen and (max-width: 768px) {
#product .product_detail_right .product_detail_inner .product_detail_img .product_detail_imgIn h3 {
position: static;
font-size: 3rem;
text-align: left;
margin-top: 30px; } }
#product .product_detail_right .product_detail_inner .product_detail_img .product_detail_imgIn h3::before {
content: url("../img/top/ico_arrow_left.png");
position: absolute;
left: 90px;
top: 0; }
@media screen and (max-width: 768px) {
#product .product_detail_right .product_detail_inner .product_detail_img .product_detail_imgIn dl {
text-align: left; } }
#product .product_detail_right .product_detail_inner .product_detail_img .product_detail_imgIn dl dt {
letter-spacing: 2px; }
#product .product_detail_right .product_detail_inner .product_detail_img .product_detail_imgIn dl dt::before {
content: "";
background: #000;
width: 25px;
height: 1px;
left: 86%;
top: -15px;
position: absolute; }
@media screen and (max-width: 768px) {
#product .product_detail_right .product_detail_inner .product_detail_img .product_detail_imgIn dl dt::before {
left: 0; } }
@media screen and (max-width: 768px) {
#product .product_detail_right .product_detail_inner .product_detail_img .product_detail_imgIn dl dt {
margin-top: 50px;
position: relative; } }
#product .product_detail_right .product_detail_inner .product_detail_img .product_detail_imgIn dl dd {
font-size: 1.1rem;
margin-top: 20px;
letter-spacing: 2px; }
#product .product_detail_right .product_detail_inner .product_detail_txt {
display: flex;
margin: 50px auto;
text-align: left;
justify-content: flex-end; }
@media screen and (max-width: 768px) {
#product .product_detail_right .product_detail_inner .product_detail_txt {
display: block;
width: 88%;
margin: 0 auto 35px; } }
#product .product_detail_right .product_detail_inner .product_detail_txt p {
width: 37%;
margin-left: 50px;
display: block;
font-size: 1.4rem;
margin-right: 0; }
@media screen and (max-width: 768px) {
#product .product_detail_right .product_detail_inner .product_detail_txt p {
margin-left: 0;
margin-right: 0;
margin-top: 20px;
width: 100%; } }
.interview {
margin-bottom: 150px; }
@media screen and (max-width: 768px) {
.interview {
margin-bottom: 80px; } }
.interview:last-child {
margin-bottom: 175px; }
@media screen and (max-width: 768px) {
.interview:last-child {
margin-bottom: 80px; } }
.interview .interview_main .pc {
width: 90%; }
.interview .interview_main .sp {
width: 100%; }
.interview .interview_about {
width: 80%;
margin: 60px auto 90px;
border: 1px solid #000;
padding: 50px;
position: relative; }
@media screen and (max-width: 768px) {
.interview .interview_about {
width: 88%;
padding: 50px 25px;
margin: 55px auto 25px; } }
.interview .interview_about::before {
content: url("../img/top/txt_interview_about.png");
position: absolute;
right: 20px;
top: 20px; }
.interview .interview_about::after {
content: "";
display: block;
position: absolute;
background: #fff;
border-top: 1px solid #000;
border-right: 1px solid #000;
width: 200px;
height: 90px;
bottom: -1px;
left: -1px; }
@media screen and (max-width: 768px) {
.interview .interview_about::after {
height: 30px; } }
.interview .interview_about ul {
display: flex; }
@media screen and (max-width: 768px) {
.interview .interview_about ul {
display: block; } }
.interview .interview_about ul li.interview_about_txt {
width: 60%; }
.interview .interview_about ul li.interview_about_txt.interview_face {
width: 15%;
margin-right: 12.5%; }
@media screen and (max-width: 768px) {
.interview .interview_about ul li.interview_about_txt.interview_face {
width: 150px;
margin-right: 0;
margin-bottom: 30px; } }
@media screen and (max-width: 768px) {
.interview .interview_about ul li.interview_about_txt {
width: 100%; } }
.interview .interview_about ul li.interview_about_txt p {
font-size: 1.4rem;
margin-bottom: 30px; }
.interview .interview_about ul li.interview_about_txt p.under_border {
padding-bottom: 40px;
margin-bottom: 40px;
border-bottom: 1px solid #000; }
.interview .interview_about ul li.interview_about_txt dl {
margin-top: 0; }
.interview .interview_about ul li.interview_about_txt dl:last-child {
margin-top: 30px; }
.interview .interview_about ul li.interview_about_txt dl dt {
margin-bottom: 20px;
font-weight: bold; }
.interview .interview_about ul li.interview_about_txt dl dt a {
border-bottom: 1px solid #000; }
.interview .interview_about ul li.interview_about_txt dl dd {
font-size: 1.4rem; }
.interview .interview_about .interview_about_ex {
color: #fff;
background: #000;
margin-top: 40px;
z-index: 10;
position: relative;
padding: 8px; }
.interview .interview_about .interview_about_ex .interview_about_exIn {
border: 1px solid #fff; }
.interview .interview_about .interview_about_ex .interview_about_exIn ul {
display: flex;
flex-wrap: nowrap;
padding: 30px;
align-items: center; }
@media screen and (max-width: 768px) {
.interview .interview_about .interview_about_ex .interview_about_exIn ul {
display: block; } }
.interview .interview_about .interview_about_ex .interview_about_exIn ul li {
font-size: 1.4rem;
width: 36.5%;
padding: 0px 30px;
border-left: 1px solid #fff; }
.interview .interview_about .interview_about_ex .interview_about_exIn ul li:first-child {
font-weight: bold;
width: 27%;
text-align: center;
border-left: none; }
@media screen and (max-width: 768px) {
.interview .interview_about .interview_about_ex .interview_about_exIn ul li:first-child {
width: 100%;
padding-bottom: 20px;
margin-bottom: 20px;
border-bottom: 1px solid #fff; } }
.interview .interview_about .interview_about_ex .interview_about_exIn ul li:first-child span {
font-size: 1.4rem; }
.interview .interview_about .interview_about_ex .interview_about_exIn ul li a {
border-bottom: 1px solid #fff; }
.interview .interview_about .interview_about_ex .interview_about_exIn ul li:last-child {
border-left: 1px dashed #fff; }
@media screen and (max-width: 768px) {
.interview .interview_about .interview_about_ex .interview_about_exIn ul li:last-child {
border-left: none; } }
@media screen and (max-width: 768px) {
.interview .interview_about .interview_about_ex .interview_about_exIn ul li {
width: 100%;
padding: 0;
border-left: none;
margin-top: 20px; } }
.interview .interview_about .interview_about_ex .interview_about_exIn ul li h4 {
font-weight: bold;
font-size: 1.8rem; }
.interview .interview_about .interview_about_ex .interview_about_exIn ul li h4 span {
font-size: 1.4rem;
font-weight: bold; }
.interview .interview_about .interview_about_ex .interview_about_exIn ul li p {
font-family: YuGothic, "Yu Gothic medium", "Hiragino Sans", Meiryo, "sans-serif"; }
.interview .interview_detail {
width: 80%;
margin: 0 auto; }
@media screen and (max-width: 768px) {
.interview .interview_detail {
width: 88%; } }
.interview .interview_detail .interview_detail_inner .question1, .interview .interview_detail .interview_detail_inner .question5, .interview .interview_detail .interview_detail_inner .question6 {
border-bottom: 1px dashed #000;
padding-bottom: 30px;
margin-bottom: 30px; }
.interview .interview_detail .interview_detail_inner .question1 ul, .interview .interview_detail .interview_detail_inner .question5 ul, .interview .interview_detail .interview_detail_inner .question6 ul {
display: flex;
flex-wrap: nowrap;
justify-content: space-between; }
@media screen and (max-width: 768px) {
.interview .interview_detail .interview_detail_inner .question1 ul, .interview .interview_detail .interview_detail_inner .question5 ul, .interview .interview_detail .interview_detail_inner .question6 ul {
display: block; } }
.interview .interview_detail .interview_detail_inner .question1 ul li, .interview .interview_detail .interview_detail_inner .question5 ul li, .interview .interview_detail .interview_detail_inner .question6 ul li {
width: 56.4%; }
@media screen and (max-width: 768px) {
.interview .interview_detail .interview_detail_inner .question1 ul li, .interview .interview_detail .interview_detail_inner .question5 ul li, .interview .interview_detail .interview_detail_inner .question6 ul li {
width: 100%; } }
.interview .interview_detail .interview_detail_inner .question1 ul li.interview_detail_face, .interview .interview_detail .interview_detail_inner .question5 ul li.interview_detail_face, .interview .interview_detail .interview_detail_inner .question6 ul li.interview_detail_face {
width: 37.7%; }
@media screen and (max-width: 768px) {
.interview .interview_detail .interview_detail_inner .question1 ul li.interview_detail_face, .interview .interview_detail .interview_detail_inner .question5 ul li.interview_detail_face, .interview .interview_detail .interview_detail_inner .question6 ul li.interview_detail_face {
width: 100%;
margin-bottom: 30px; } }
.interview .interview_detail .interview_detail_inner .question1 ul li h3, .interview .interview_detail .interview_detail_inner .question5 ul li h3, .interview .interview_detail .interview_detail_inner .question6 ul li h3 {
margin-bottom: 18px;
font-weight: bold; }
.interview .interview_detail .interview_detail_inner .question1 ul li h3.question_ico1, .interview .interview_detail .interview_detail_inner .question5 ul li h3.question_ico1, .interview .interview_detail .interview_detail_inner .question6 ul li h3.question_ico1 {
padding-left: 80px;
font-size: 2rem;
position: relative; }
.interview .interview_detail .interview_detail_inner .question1 ul li h3.question_ico1::before, .interview .interview_detail .interview_detail_inner .question5 ul li h3.question_ico1::before, .interview .interview_detail .interview_detail_inner .question6 ul li h3.question_ico1::before {
content: url("../img/top/ico_q1.png");
position: absolute;
left: 0px; }
.interview .interview_detail .interview_detail_inner .question1 ul li h3.question_ico5, .interview .interview_detail .interview_detail_inner .question5 ul li h3.question_ico5, .interview .interview_detail .interview_detail_inner .question6 ul li h3.question_ico5 {
padding-left: 80px;
font-size: 2rem;
position: relative; }
.interview .interview_detail .interview_detail_inner .question1 ul li h3.question_ico5::before, .interview .interview_detail .interview_detail_inner .question5 ul li h3.question_ico5::before, .interview .interview_detail .interview_detail_inner .question6 ul li h3.question_ico5::before {
content: url("../img/top/ico_q5.png");
position: absolute;
left: 0px; }
.interview .interview_detail .interview_detail_inner .question1 ul li h3.question_ico6, .interview .interview_detail .interview_detail_inner .question5 ul li h3.question_ico6, .interview .interview_detail .interview_detail_inner .question6 ul li h3.question_ico6 {
padding-left: 80px;
font-size: 2rem;
position: relative; }
.interview .interview_detail .interview_detail_inner .question1 ul li h3.question_ico6::before, .interview .interview_detail .interview_detail_inner .question5 ul li h3.question_ico6::before, .interview .interview_detail .interview_detail_inner .question6 ul li h3.question_ico6::before {
content: url("../img/top/ico_q6.png");
position: absolute;
left: 0px; }
.interview .interview_detail .interview_detail_inner .question1 ul li p, .interview .interview_detail .interview_detail_inner .question5 ul li p, .interview .interview_detail .interview_detail_inner .question6 ul li p {
font-size: 1.4rem;
margin-bottom: 30px; }
.interview .interview_detail .interview_detail_inner .question1 ul li p:last-child, .interview .interview_detail .interview_detail_inner .question5 ul li p:last-child, .interview .interview_detail .interview_detail_inner .question6 ul li p:last-child {
margin-bottom: 0; }
.interview .interview_detail .interview_detail_inner .question2 {
display: flex;
justify-content: space-between;
margin-bottom: 30px; }
@media screen and (max-width: 768px) {
.interview .interview_detail .interview_detail_inner .question2 {
display: block; } }
.interview .interview_detail .interview_detail_inner .question2 p {
font-size: 1.4rem; }
.interview .interview_detail .interview_detail_inner .question2 .question2_jp h3 {
padding-left: 80px;
font-size: 2rem;
position: relative;
margin-bottom: 15px;
font-weight: bold; }
.interview .interview_detail .interview_detail_inner .question2 .question2_jp h3::before {
content: url("../img/top/ico_q2.png");
position: absolute;
left: 0px;
top: -7px; }
.interview .interview_detail .interview_detail_inner .question2 .question2_jp h3 span {
font-size: 1.6rem;
font-weight: bold; }
.interview .interview_detail .interview_detail_inner .question2 .question2_jp .question2_box {
display: flex;
justify-content: space-between; }
@media screen and (max-width: 768px) {
.interview .interview_detail .interview_detail_inner .question2 .question2_jp .question2_box {
display: block; } }
.interview .interview_detail .interview_detail_inner .question2 .question2_jp .question2_box p {
width: 47.5%; }
@media screen and (max-width: 768px) {
.interview .interview_detail .interview_detail_inner .question2 .question2_jp .question2_box p {
width: 100%;
margin-bottom: 30px; } }
.interview .interview_detail .interview_detail_inner .question34 {
border-top: 1px dashed #000;
padding-top: 30px;
margin-top: 50px; }
.interview .interview_detail .interview_detail_inner .question34 ul {
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
width: 100%; }
@media screen and (max-width: 768px) {
.interview .interview_detail .interview_detail_inner .question34 ul {
display: block; } }
.interview .interview_detail .interview_detail_inner .question34 ul li {
width: 50%;
padding-right: 4%;
border-right: 1px dashed #000; }
.interview .interview_detail .interview_detail_inner .question34 ul li:last-child {
padding-right: 0;
border-right: 0;
padding-left: 4%; }
@media screen and (max-width: 768px) {
.interview .interview_detail .interview_detail_inner .question34 ul li:last-child {
padding-left: 0; } }
@media screen and (max-width: 768px) {
.interview .interview_detail .interview_detail_inner .question34 ul li {
width: 100%;
margin-bottom: 30px;
padding-right: 0;
border-right: none;
border-bottom: 1px dashed #000;
padding-bottom: 30px; } }
.interview .interview_detail .interview_detail_inner .question34 ul li h3 {
margin-bottom: 18px;
font-weight: bold; }
.interview .interview_detail .interview_detail_inner .question34 ul li h3.question_ico3 {
padding-left: 80px;
font-size: 2rem;
position: relative; }
.interview .interview_detail .interview_detail_inner .question34 ul li h3.question_ico3::before {
content: url("../img/top/ico_q3.png");
position: absolute;
left: 0px; }
.interview .interview_detail .interview_detail_inner .question34 ul li h3.question_ico4 {
padding-left: 80px;
font-size: 2rem;
position: relative; }
.interview .interview_detail .interview_detail_inner .question34 ul li h3.question_ico4::before {
content: url("../img/top/ico_q4.png");
position: absolute;
left: 0px; }
.interview .interview_detail .interview_detail_inner .question34 ul li p {
font-size: 1.4rem;
margin-bottom: 30px; }
.interview .interview_detail .interview_detail_inner .question34 ul li p:last-child {
margin-bottom: 0; }
.interview .interview_detail .interview_detail_inner .question6 {
border-top: 1px dashed #000;
padding-top: 30px;
margin-top: 30px;
border-bottom: none;
margin-bottom: 0; }
.interview .interview_detail .interview_detail_inner .question5 {
border-top: 1px dashed #000;
padding-top: 30px;
margin-top: 30px;
border-bottom: none;
margin-bottom: 0; }
@media screen and (max-width: 768px) {
.interview .interview_detail .interview_detail_inner .question5 {
padding-bottom: 0;
padding-top: 0;
border-top: none; } }
.interview .interview_detail .interview_detail_inner .question5 li.interview_detail_face {
width: 37.7%; }
@media screen and (max-width: 768px) {
.interview .interview_detail .interview_detail_inner .question5 li.interview_detail_face {
width: 100%;
margin-top: 30px;
margin-bottom: 0; } }
.interview .interview_detail .interview_detail_inner .Acbtn {
background: #000;
color: #fff;
display: block;
width: 100%;
padding: 20px;
font-size: 2.2rem;
text-align: center;
position: relative; }
.interview .interview_detail .interview_detail_inner .Acbtn::before {
content: url("../img/top/ico_close.png");
position: absolute;
left: 43%;
top: 22%; }
@media screen and (max-width: 768px) {
.interview .interview_detail .interview_detail_inner .Acbtn::before {
content: none; } }
.interview .interview_detail .interview_detail_inner .Acbtn.close::before {
content: url("../img/top/ico_open.png");
position: absolute;
left: 43%;
top: 22%; }
@media screen and (max-width: 768px) {
.interview .interview_detail .interview_detail_inner .Acbtn.close::before {
content: none; } }
.allitem_footer {
background: #F1F4F7;
padding-bottom: 40px; }
.allitem {
text-align: center; }
.allitem h2 {
max-width: 286px;
margin: 0 auto 0;
position: relative;
top: -30px; }
.allitem ul {
display: flex;
justify-content: center;
flex-wrap: wrap; }
.allitem ul li {
position: relative;
width: 24%;
padding: 50px 25px;
border-right: 1px dashed #000; }
.allitem ul li::after {
content: "";
width: 94%;
height: 1px;
position: absolute;
bottom: 0;
right: 3%;
border-bottom: 1px dashed #000; }
@media screen and (max-width: 768px) {
.allitem ul li {
width: 49%; }
.allitem ul li:nth-child(2n) {
border-right: 0; } }
.allitem ul li:nth-child(4n) {
border-right: 0; }
.allitem ul li:last-child {
border-right: 0; }
.allitem ul li .allitem_num {
position: absolute;
top: 15px;
left: 15px;
text-align: left;
font-size: 3rem; }
.allitem ul li .allitem_num span {
font-size: 4.5rem; }
.allitem ul li .allitem_title {
position: absolute;
bottom: 15px;
text-align: center;
left: 50%;
-moz-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translate(-50%);
/*位置調整*/
width: 100%; }
.allitem ul li .allitem_title span {
border-bottom: 1px solid; }
.allitem ul li img {
width: 80%; }
.allitem .link_box {
background: #000;
color: #fff;
display: block;
width: 90%;
padding: 20px;
font-size: 2.2rem;
text-align: center;
margin: 20px auto 40px; }
#glamb .glamb_inner {
width: 88%;
max-width: 900px;
margin: 90px auto 0;
position: relative;
z-index: 3; }
@media screen and (max-width: 768px) {
#glamb .glamb_inner {
margin: 70px auto 0; } }
#glamb .glamb_inner .glamb_detail {
padding: 50px 0;
border-top: 1px solid #000;
border-bottom: 1px solid #000;
display: flex;
align-items: center;
font-size: 1.2rem;
margin-bottom: 40px;
line-height: 2;
letter-spacing: 1px; }
@media screen and (max-width: 768px) {
#glamb .glamb_inner .glamb_detail {
padding: 30px 0;
display: block;
margin-bottom: 70px; } }
#glamb .glamb_inner .glamb_detail img {
padding: 0 40px;
width: 220px; }
@media screen and (max-width: 768px) {
#glamb .glamb_inner .glamb_detail img {
padding: 0 0 25px;
width: 110px;
display: block;
margin: 0 auto; } }
#glamb .glamb_ext {
width: 88%;
margin: 0 auto;
position: relative;
z-index: 3; }
@media screen and (max-width: 768px) {
#glamb .glamb_ext {
width: 100%; } }
#footer {
background: #000;
color: #fff;
padding-bottom: 50px; }
#footer .footer_inner {
width: 88%;
max-width: 900px;
margin: -240px auto 0;
padding-top: 240px; }
@media screen and (max-width: 768px) {
#footer .footer_inner {
margin: 0 auto;
padding-top: 30px; } }
#footer .footer_inner .shop ul {
display: flex;
flex-wrap: nowrap;
padding: 30px 0 40px; }
@media screen and (max-width: 768px) {
#footer .footer_inner .shop ul {
display: block;
padding: 0; } }
#footer .footer_inner .shop ul li {
width: 41%;
border-left: 1px solid #fff;
padding: 5px 20px;
font-size: 1.2rem; }
@media screen and (max-width: 768px) {
#footer .footer_inner .shop ul li {
margin-bottom: 20px;
width: 100%; } }
#footer .footer_inner .shop ul li:first-child {
border-left: none;
padding-right: 0; }
#footer .footer_inner .shop ul li.flag {
width: 18%;
font-size: 1.4rem;
padding-left: 0;
letter-spacing: 1px; }
@media screen and (max-width: 768px) {
#footer .footer_inner .shop ul li.flag {
width: 100%;
margin-bottom: 30px; } }
#footer .footer_inner .shop ul li h3 {
font-size: 2rem;
margin-bottom: 20px;
letter-spacing: 2px; }
#footer .footer_inner .shop ul li a {
padding: 5px;
border: 1px solid #fff;
margin-left: 10px;
color: #fff; }
#footer .footer_inner .shop .shop_tel {
width: 58%;
margin: 0 auto;
display: flex;
font-size: 1.4rem;
text-align: center;
justify-content: space-between; }
@media screen and (max-width: 768px) {
#footer .footer_inner .shop .shop_tel {
width: 100%;
display: block; } }
#footer .footer_inner .shop .shop_tel a {
width: 48%;
padding: 10px;
line-height: 1;
background: #333; }
@media screen and (max-width: 768px) {
#footer .footer_inner .shop .shop_tel a {
width: 100%;
margin-bottom: 10px;
display: block; } }
#footer .footer_inner .shop .shop_tel a img {
width: 18px;
margin-right: 5px; }
#footer .footer_inner .footer_content {
width: 100%;
border: 1px solid #fff;
padding: 3%;
display: flex;
font-size: 1.4rem;
margin: 60px auto 35px; }
#footer .footer_inner .footer_content h4 {
width: 14%;
border-right: 1px solid #fff; }
@media screen and (max-width: 768px) {
#footer .footer_inner .footer_content h4 {
width: 40%; } }
#footer .footer_inner .footer_content ul {
padding: 0 6%;
display: flex;
flex-wrap: wrap;
width: 86%; }
@media screen and (max-width: 768px) {
#footer .footer_inner .footer_content ul {
width: 60%;
display: block; } }
#footer .footer_inner .footer_content ul li {
width: 25%; }
@media screen and (max-width: 768px) {
#footer .footer_inner .footer_content ul li {
width: 100%; } }
#footer .footer_inner .link_app {
text-align: center;
font-size: 1.2rem;
margin-bottom: 40px; }
#footer .footer_inner .link_icos {
display: flex;
justify-content: space-between;
width: 40%;
flex-wrap: wrap;
margin: 0 auto; }
@media screen and (max-width: 768px) {
#footer .footer_inner .link_icos {
width: 100%; } }
#footer .footer_inner .link_icos li a {
display: block; }
#footer .footer_inner .footer_logo {
text-align: center;
margin: 60px auto 25px;
width: 116px; }
#footer .footer_inner .footer_copy {
text-align: center;
font-size: 1.4rem; }
/* .page_international */
.page_international {
/*#main{
.pc{
background: url("../img/international/img_main.jpg") center no-repeat;
height: 450px;
background-size: cover;
}
.sp{
width: 100%;
background: url("../img/international/img_main_sp.jpg") center no-repeat;
background-size: cover;
}
h1{
text-align: center;
padding-top: 90px;
img{
width: 262px;
}
@include mq{
padding: 238px 5% 208px 52%;
img{
width: 100%;
}
}
}
}*/ }
.page_international #close .inner {
margin: 0 auto;
padding: 150px 0 0;
max-width: 1200px;
width: 88%;
text-align: right;
position: absolute;
left: 50%;
-moz-transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translate(-50%);
/*位置調整*/ }
@media screen and (max-width: 768px) {
.page_international #close .inner {
padding: 100px 0 50px;
width: 100%; } }
@media screen and (max-width: 768px) {
.page_international #close .inner p {
padding: 6% 6% 0 0;
float: right;
width: 12.8%;
display: block; } }
@media screen and (min-width: 768px) {
.page_international #close .inner p {
float: right;
text-align: right;
padding: 0; } }
.page_international #close .inner p a {
display: block;
width: 44px; }
.page_international #intro .inner {
padding: 150px 0 120px; }
.page_international #intro .inner h2 {
font-size: 4.0rem;
letter-spacing: 0.13em; }
@media screen and (max-width: 768px) {
.page_international #intro .inner h2 {
font-size: 3.4rem; } }
.page_international #intro .inner h3 {
position: relative;
display: inline-block;
margin-bottom: 68px;
font-size: 2.4rem;
letter-spacing: 0.13em; }
@media screen and (max-width: 768px) {
.page_international #intro .inner h3 {
font-size: 2.0rem; } }
.page_international #intro .inner h3:before {
content: '';
position: absolute;
bottom: -30px;
display: inline-block;
width: 25px;
height: 1px;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
background-color: black; }
.page_international #instructions h2 {
max-width: 1200px;
text-align: center;
font-size: 2.0rem;
text-align: center;
border-bottom: 1px solid #000;
border-top: 1px solid #000;
padding: 10px 0;
margin: 0 auto 35px;
width: 96%; }
@media screen and (max-width: 768px) {
.page_international #instructions h2 {
font-size: 1.8rem;
margin-bottom: 30px; } }
.page_international #instructions .inner {
max-width: 1200px;
width: 88%;
margin: 0 auto; }
.page_international #instructions .inner aside {
max-width: 950px;
width: 88%;
margin: 0 auto 60px;
border-bottom: 1px dashed #000; }
@media screen and (max-width: 768px) {
.page_international #instructions .inner aside {
width: 100%; } }
.page_international #instructions .inner aside::after {
content: url("../img/international/ico_arrow.png");
transform: scale3d(0.5, 0.5, 0.5);
display: block;
height: 18px;
text-align: center;
margin: auto; }
.page_international #instructions .inner aside h3 {
display: flex;
margin-bottom: 30px; }
@media screen and (max-width: 768px) {
.page_international #instructions .inner aside h3 {
margin-bottom: 24px;
display: block;
text-align: center; } }
.page_international #instructions .inner aside h3 p {
line-height: 1.5; }
.page_international #instructions .inner aside h3 p.tit_step {
width: 10.5%;
background-color: #000;
color: #fff;
text-align: center;
padding-top: 21px;
font-size: 1.6rem;
margin-right: 3%; }
@media screen and (max-width: 768px) {
.page_international #instructions .inner aside h3 p.tit_step {
background-color: #fff;
margin: auto;
width: 100%;
margin-bottom: 40px; } }
@media screen and (max-width: 768px) {
.page_international #instructions .inner aside h3 p.tit_step span {
background-color: #000;
text-align: center;
padding: 20px 28px; } }
.page_international #instructions .inner aside h3 p.tit_text {
font-size: 2.2rem;
font-weight: bold; }
@media screen and (max-width: 768px) {
.page_international #instructions .inner aside h3 p.tit_text {
font-size: 1.8rem; } }
.page_international #instructions .inner aside h3 p.tit_text span {
font-size: 1.8rem;
font-weight: bold; }
@media screen and (max-width: 768px) {
.page_international #instructions .inner aside h3 p.tit_text span {
font-size: 1.6rem; } }
.page_international #instructions .inner aside ul {
padding-bottom: 60px; }
@media screen and (max-width: 768px) {
.page_international #instructions .inner aside ul {
padding-bottom: 10px; } }
.page_international #instructions .inner aside ul li {
float: left; }
@media screen and (max-width: 768px) {
.page_international #instructions .inner aside ul li {
float: none; } }
.page_international #instructions .inner aside ul li.cont_left {
width: 46.8%;
margin-right: 4.2%; }
@media screen and (max-width: 768px) {
.page_international #instructions .inner aside ul li.cont_left {
width: 100%;
margin-bottom: 28px; } }
.page_international #instructions .inner aside ul li.cont_right {
width: 49%;
font-size: 1.6rem; }
@media screen and (max-width: 768px) {
.page_international #instructions .inner aside ul li.cont_right {
font-size: 1.4rem;
width: 100%; } }
.page_international #instructions .inner aside ul li.cont_right p {
margin-bottom: 30px; }
.page_international #instructions .inner aside .cont_caution {
font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Segoe UI', HiraginoCustom, 'Hiragino Kaku Gothic ProN', YuGothic, 'Yu Gothic Medium', Meiryo, sans-serif;
border: 10px solid #E6E6E6;
margin-bottom: 58px; }
@media screen and (max-width: 768px) {
.page_international #instructions .inner aside .cont_caution {
margin-bottom: 40px; } }
.page_international #instructions .inner aside .cont_caution::before {
content: url("../img/international/ico_exclamation.png");
transform: scale3d(0.5, 0.5, 0.5);
display: block;
height: 18px;
text-align: center;
margin: auto;
margin-top: -34px; }
.page_international #instructions .inner aside .cont_caution .caution_jp {
padding: 5%;
width: 50%;
float: left;
background: url("../img/international/bg_border-center.png") right no-repeat;
font-size: 1.4rem; }
.page_international #instructions .inner aside .cont_caution .caution_jp p {
margin-bottom: 18px; }
.page_international #instructions .inner aside .cont_caution .caution_jp dl {
display: flex;
margin-bottom: 1%;
width: 100%;
background-color: #F2F2F2; }
.page_international #instructions .inner aside .cont_caution .caution_jp dl dt {
background-color: #000;
color: #fff;
padding: 0.2em 1em;
width: 6em;
text-align: center; }
.page_international #instructions .inner aside .cont_caution .caution_jp dl dd {
background-color: #F2F2F2;
padding: 0.2em 1em; }
.page_international #instructions .inner aside .cont_caution .caution_jp .txt_link {
margin-top: 18px;
font-size: 1.2rem; }
.page_international #instructions .inner aside .cont_caution .caution_jp .txt_link a {
text-decoration: underline; }
.page_international #instructions .inner aside .cont_caution .caution_jp .txt_link a:hover {
text-decoration: none; }
@media screen and (max-width: 768px) {
.page_international #instructions .inner aside .cont_caution .caution_jp {
padding-top: 40px;
float: none;
background: url("../img/international/bg_border.png") bottom repeat-x;
width: 100%; } }
.page_international #instructions .inner aside .cont_caution .caution_en {
padding: 5%;
width: 50%;
float: left;
font-size: 1.4rem; }
.page_international #instructions .inner aside .cont_caution .caution_en p {
margin-bottom: 18px; }
.page_international #instructions .inner aside .cont_caution .caution_en ul li {
padding: 0.2em 0.5em 0.2em 1.5em;
width: 100%;
display: block;
background-color: #F2F2F2;
margin-bottom: 1%; }
.page_international #instructions .inner aside .cont_caution .caution_en ul li::before {
content: '・';
margin-left: -0.5em; }
.page_international #instructions .inner aside .cont_caution .caution_en .txt_link {
margin-top: 18px;
font-size: 1.2rem; }
.page_international #instructions .inner aside .cont_caution .caution_en .txt_link a {
text-decoration: underline; }
.page_international #instructions .inner aside .cont_caution .caution_en .txt_link a:hover {
text-decoration: none; }
@media screen and (max-width: 768px) {
.page_international #instructions .inner aside .cont_caution .caution_en {
float: none;
width: 100%; } }
.page_international #instructions .inner aside.instructions_step3 {
border-bottom: none; }
.page_international #instructions .inner aside.instructions_step3::after {
content: ''; }
.page_international #instructions .inner aside.instructions_step3 p.imgFl {
margin-bottom: 30px; }
@media screen and (max-width: 768px) {
.page_international #instructions .inner aside.instructions_step3 p.imgFl {
margin-bottom: 23px; } }
.page_international #instructions .inner aside.instructions_step3 dl {
margin-bottom: 45px; }
.page_international #instructions .inner aside.instructions_step3 dl dt {
font-size: 1.6rem;
margin-bottom: 10px; }
.page_international #instructions .inner aside.instructions_step3 dl dd {
font-size: 1.4rem; }
@media screen and (max-width: 768px) {
.page_international #instructions .inner aside.instructions_step3 dl dd {
font-size: 1.2rem; } }
.page_international #instructions .inner aside.instructions_step3 dl dd.instructions_step3-jpFont {
font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Segoe UI', HiraginoCustom, 'Hiragino Kaku Gothic ProN', YuGothic, 'Yu Gothic Medium', Meiryo, sans-serif; }
.page_international #caution {
max-width: 1200px;
text-align: center;
font-size: 2.0rem;
text-align: center;
border-bottom: 1px solid #000;
border-top: 1px solid #000;
padding: 10px 0;
margin: 0 auto 35px;
width: 96%;
border: 10px solid #E6E6E6; }
@media screen and (max-width: 768px) {
.page_international #caution {
font-size: 1.8rem;
margin-bottom: 30px; } }
.page_international #caution::before {
content: url("../img/international/ico_exclamation.png");
transform: scale3d(0.5, 0.5, 0.5);
display: block;
height: 18px;
text-align: center;
margin: auto;
margin-top: -44px; }
.page_international #caution h2 {
font-size: 2.4rem;
padding-top: 40px;
margin-bottom: 30px;
font-weight: bold; }
.page_international #caution h3 {
font-size: 2.4rem;
padding-top: 40px;
margin-bottom: 30px; }
.page_international #caution ul li {
font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Segoe UI', HiraginoCustom, 'Hiragino Kaku Gothic ProN', YuGothic, 'Yu Gothic Medium', Meiryo, sans-serif;
text-align: left;
font-size: 1.4rem; }
@media screen and (max-width: 768px) {
.page_international #caution ul li {
font-size: 1.2rem; } }
.page_international #caution ul.list_mDots {
margin-bottom: 35px; }
.page_international #caution ul.list_mDots li {
padding-left: 1em; }
.page_international #caution ul.list_mDots li::before {
content: '・';
width: 1em;
margin-left: -0.45em; }
.page_international #caution ul.list_arrow li {
padding-left: 1em; }
.page_international #caution ul.list_arrow li::before {
content: '>';
width: 1em;
margin-left: -0.45em; }
.page_international #caution .caution_jp {
padding: 0 5% 5%;
background: url("../img/international/bg_border.png") bottom repeat-x; }
.page_international #caution .caution_en {
padding: 0 5% 5%; }
.page_international #close_footer .inner {
margin: 0 auto;
padding: 65px 0 0;
max-width: 1200px;
width: 88%; }
@media screen and (max-width: 768px) {
.page_international #close_footer .inner {
padding: 40px 0 10px;
width: 100%; } }
@media screen and (max-width: 768px) {
.page_international #close_footer .inner p {
display: block; } }
@media screen and (min-width: 768px) {
.page_international #close_footer .inner p {
padding: 0; } }
.page_international #close_footer .inner p a {
display: block;
width: 44px;
margin: auto; }
/*# sourceMappingURL=style.css.map */