/* LESS Document */
html,
body {
width: 100%;
height: 100%;
}
body {
background: #f6f4f0;
}
/* sp-dl-block */
.skip-link {
display: none;
}
/* Color
--------------------------------------------------------------------------*/
/* link */
/* list style */
/* size
--------------------------------------------------------------------------*/
/* FONT
--------------------------------------------------------------------------*/
body {
font-family: 'Noto Sans JP', '游ゴシック Medium', YuGothic, YuGothicM, 'Hiragino Kaku Gothic ProN', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, sans-serif;
color: #222;
}
/*
h3, h4, h5, h6{
transform: rotate(0.03deg);
}
*/
p,
td,
th,
dt,
dd,
li {
font-weight: 300;
color: #434343;
}
.brk-pt {
display: block;
}
.brp-pt {
display: block;
}
.brd-pt {
display: inline;
}
.a-center {
text-align: center;
}
.a-right {
text-align: right;
}
.tx-l {
font-size: 240%;
}
.pc-view {
display: block !important;
}
.sp-view {
display: none !important;
}
img {
width: 100%;
}
@media screen and (max-width: 751px) {
.brp-pt {
display: inline;
}
.brd-pt {
display: block;
}
.pc-view {
display: none !important;
}
.sp-view {
display: block !important;
}
}
/* Loading
--------------------------------------------------------------------------*/
#loader {
display: block;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
overflow: hidden;
z-index: 9999;
}
.loading-img img {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
width: 5rem;
opacity: 0;
transform: scale(1);
z-index: 9999;
}
.shutter {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #FFF;
z-index: 9998;
}
.loading-img.open img {
-webkit-animation: logoanime 2s forwards;
animation: logoanime 2s forwards;
}
.shutter.open {
-webkit-animation: byeShutter 2s forwards;
animation: byeShutter 2s forwards;
}
@keyframes logoanime {
40% {
opacity: 1;
transform: scale(1);
filter: blur(0px);
}
99% {
opacity: 0;
transform: scale(1.2);
filter: blur(30px);
}
100% {
display: none;
}
}
@keyframes byeShutter {
70% {
opacity: 1;
}
100% {
opacity: 0;
display: none;
z-index: -1;
}
}
/* LAYOUT
--------------------------------------------------------------------------*/
.layout-base {
position: relative;
box-sizing: border-box;
}
#wrap {
position: relative;
box-sizing: border-box;
width: 100%;
margin: auto;
}
article.layout1 {
position: relative;
box-sizing: border-box;
width: 100%;
padding: 0 0 4rem 0;
z-index: 0;
overflow: hidden;
}
.layout1 section {
position: relative;
box-sizing: border-box;
max-width: 100rem;
margin: auto;
display: block;
}
@media screen and (max-width: 751px) {
article.layout1 {
position: relative;
box-sizing: border-box;
width: 100%;
padding: 0 0 5vw 0;
z-index: 0;
overflow: hidden;
}
}
/* Main
--------------------------------------------------------------------------*/
main {
position: relative;
box-sizing: border-box;
width: 100%;
}
main article {
position: relative;
box-sizing: border-box;
width: 100%;
max-width: 100rem;
margin: auto;
background: #FFFFFF;
}
main article section {
position: relative;
box-sizing: border-box;
width: 100%;
padding: 2.8rem 0 3.125rem 0;
}
main article section:last-child {
border: none;
}
main article section .cnt-wrap {
position: relative;
box-sizing: border-box;
width: 72%;
margin: 0 14%;
}
.cnt-l {
float: left;
}
.cnt-r {
float: right;
}
.cnt-box0 {
position: relative;
box-sizing: border-box;
width: 100%;
padding: 1.1875rem 0;
overflow: hidden;
}
.cnt-box1 {
position: relative;
box-sizing: border-box;
width: 100%;
border-bottom: solid 1px #f26e3f;
padding: 1.1875rem 0;
overflow: hidden;
}
.cnt-box1 .cnt-l {
width: 39%;
}
.cnt-box1 .cnt-r {
width: 58%;
}
.cnt-box1-nb {
position: relative;
box-sizing: border-box;
width: 100%;
padding: 2rem 0 0 0;
overflow: hidden;
}
.cnt-box1-nb .cnt-l {
width: 39%;
}
.cnt-box1-nb .cnt-r {
width: 58%;
}
.cnt-box1r {
position: relative;
box-sizing: border-box;
width: 100%;
border-bottom: solid 1px #f26e3f;
padding: 1.1875rem 0;
overflow: hidden;
}
.cnt-box1r .cnt-l {
width: 58%;
}
.cnt-box1r .cnt-r {
width: 39%;
}
.cnt-box1-end {
border: none;
}
.cnt-box-itv {
position: relative;
box-sizing: border-box;
width: 100%;
padding: 1.1875rem 0 0 0;
overflow: hidden;
}
.cnt-box-itv .cnt-l {
width: 58%;
}
.cnt-box-itv .cnt-r {
width: 39%;
}
.bg-yellow {
background: url("../img/main-bg.png") #fcfad4;
}
.bg-blue {
background: url("../img/main-bg.png") #e6f6fa;
}
.image-s1 {
width: 80%;
margin: 0 10%;
}
.mb-z {
margin-bottom: 0 !important;
padding-bottom: 0 !important;
}
.mt-z {
margin-top: 0 !important;
padding-top: 0 !important;
}
.box-noboder {
border-bottom: none !important;
padding-bottom: 0 !important;
}
.box-art {
position: relative;
box-sizing: border-box;
width: 100%;
padding: 0.8rem 1.4rem 1rem 1.4rem;
border: 2px solid #CCC;
}
@media screen and (max-width: 751px) {
main article section {
position: relative;
box-sizing: border-box;
width: 100%;
padding: 1.8rem 0 2.2rem 0;
}
main article section:last-child {
border: none;
}
main article section .cnt-wrap {
position: relative;
box-sizing: border-box;
width: 86%;
margin: 0 7%;
}
.cnt-l {
float: none !important;
}
.cnt-l figure {
margin-bottom: 1rem;
}
.cnt-r {
float: none !important;
}
.cnt-r figure {
margin-bottom: 1rem;
}
.cnt-box1 {
padding: 1.1875rem 0;
}
.cnt-box1 .cnt-l {
width: 100%;
}
.cnt-box1 .cnt-r {
width: 100%;
}
.cnt-box1-nb {
width: 100%;
padding: 2rem 0 0 0;
}
.cnt-box1-nb .cnt-l {
width: 100%;
}
.cnt-box1-nb .cnt-r {
width: 100%;
}
.cnt-box1r {
width: 100%;
padding: 1.1875rem 0;
}
.cnt-box1r .cnt-l {
width: 100%;
margin-bottom: 1rem;
}
.cnt-box1r .cnt-r {
width: 100%;
}
.cnt-box1r .cnt-r figure {
margin-bottom: 0;
}
.cnt-box1r .cnt-r figure img {
margin-bottom: 0;
}
.cnt-box-itv {
width: 100%;
padding: 1.1875rem 0 0 0;
}
.cnt-box-itv .cnt-l {
width: 100%;
margin-bottom: 1rem;
}
.cnt-box-itv .cnt-r {
width: 100%;
}
.cnt-box-itv .cnt-r figure {
margin-bottom: 0;
}
.cnt-box-itv .cnt-r figure img {
margin-bottom: 0;
}
.image-s1 {
width: 100%;
margin: 0;
}
}
/* Layer
--------------------------------------------------------------------------*/
header {
z-index: 50;
}
section.key-v,
div.key-v-page {
z-index: 2;
}
section#cnt01 {
z-index: 1;
}
/* title
--------------------------------------------------------------------------*/
main article#top {
color: #111211;
font-family: 'Noto Serif JP', '游明朝', 'Yu Mincho', YuMincho, 'Hiragino Mincho Pro', serif;
}
main article#top h2 {
position: relative;
box-sizing: border-box;
display: block;
font-size: 1.6rem;
line-height: 2.2rem;
font-weight: 700;
margin-bottom: 2rem;
}
main article#top h2 span {
font-size: 1.6rem;
line-height: 2rem;
font-weight: 700;
}
main article#top h3 {
position: relative;
box-sizing: border-box;
display: block;
font-size: 1.34rem;
line-height: 1.7rem;
font-weight: 700;
margin-bottom: 0.7rem;
}
main article#top h4 {
position: relative;
box-sizing: border-box;
display: block;
font-size: 1.3rem;
line-height: 1.7rem;
font-weight: 800;
margin-bottom: 1.2rem;
}
main article#top h4 span {
font-weight: 800;
}
main article#top h5 {
position: relative;
box-sizing: border-box;
display: block;
font-size: 0.95rem;
letter-spacing: 0.03rem;
font-weight: 900;
margin-bottom: 0.6rem;
}
main article#top h6 {
position: relative;
box-sizing: border-box;
display: block;
font-size: 1.2rem;
letter-spacing: 0.03rem;
font-weight: 400;
margin-bottom: 0.6rem;
}
main article#top p,
main article#top li,
main article#top dt,
main article#top dd {
font-size: 1rem;
line-height: 1.8rem;
letter-spacing: 0.03rem;
}
main article#top p .tx-caption,
main article#top li .tx-caption,
main article#top dt .tx-caption,
main article#top dd .tx-caption {
font-size: 0.85rem;
}
main article#top p.tx-caption {
font-size: 0.85rem;
}
main article#top .tx-block {
margin-bottom: 1rem;
}
main article#page {
color: #111211;
font-family: 'Noto Serif JP', '游明朝', 'Yu Mincho', YuMincho, 'Hiragino Mincho Pro', serif;
}
main article#page h2 {
position: relative;
box-sizing: border-box;
display: inline-block;
font-size: 2rem;
line-height: 2.2rem;
font-weight: 700;
margin-bottom: 2rem;
padding-bottom: 1rem;
text-align: center;
}
main article#page h2:before {
content: "";
display: block;
bottom: -6px;
left: 0;
right: 0;
margin: auto;
border-bottom: 6px solid #d8000f;
width: 160px;
position: absolute;
}
main article#page h2:after {
content: "";
display: block;
bottom: -6px;
left: calc(50%);
margin: auto;
border-bottom: 6px solid #1b1c81;
width: 80px;
position: absolute;
}
main article#page h3 {
position: relative;
box-sizing: border-box;
display: block;
font-size: 1.6rem;
line-height: 2.2rem;
font-weight: 700;
margin-bottom: 2rem;
}
main article#page h3 span {
font-size: 1.6rem;
line-height: 2rem;
font-weight: 700;
}
main article#page h4 {
position: relative;
box-sizing: border-box;
display: block;
font-size: 1.3rem;
line-height: 1.7rem;
font-weight: 800;
margin-bottom: 1.3rem;
color: #2a416e;
background: #f6f4f0;
border-left: solid 6px #2a416e;
padding: 0.5rem 1rem 0.6rem 1rem;
}
main article#page h5 {
position: relative;
box-sizing: border-box;
display: block;
font-size: 1.1rem;
letter-spacing: 0.03rem;
font-weight: 600;
border-bottom: dotted 1px #A6A6A6;
padding: 0.5rem 0;
margin-bottom: 1.1rem;
}
main article#page h6 {
position: relative;
box-sizing: border-box;
display: block;
font-size: 1.1rem;
letter-spacing: 0.03rem;
font-weight: 400;
color: #FFF;
background: #2a416e;
border-radius: 2rem;
padding: 0.5rem 1.5rem 0.6rem 1.5rem;
margin-bottom: 1.1rem;
}
main article#page p,
main article#page li,
main article#page dt,
main article#page dd {
font-size: 1rem;
line-height: 1.8rem;
letter-spacing: 0.03rem;
margin-bottom: 1.5rem;
}
main article#page li,
main article#page dt,
main article#page dd {
font-size: 1rem;
line-height: 1.8rem;
letter-spacing: 0.03rem;
}
main article#page li .tx-caption,
main article#page dt .tx-caption,
main article#page dd .tx-caption {
font-size: 0.85rem;
}
main article#page p.tx-caption {
font-size: 0.85rem;
}
main article#page .tx-block {
margin-bottom: 1rem;
}
.tx-s {
font-size: 60%;
}
.tx-ita {
font-style: italic;
}
@media screen and (max-width: 751px) {
main article#top h2 {
font-size: 1.4rem;
line-height: 1.8rem;
margin-bottom: 1.4rem;
}
main article#top h2 span {
font-size: 1.4rem;
line-height: 1.8rem;
}
main article#top h3 {
font-size: 1.2rem;
line-height: 1.4rem;
margin-bottom: 0.7rem;
}
main article#top h4 {
position: relative;
box-sizing: border-box;
display: block;
font-size: 1.1rem;
line-height: 1.5rem;
font-weight: 800;
margin-bottom: 1.2rem;
}
main article#top h4 span {
font-weight: 800;
}
main article#top h5 {
position: relative;
box-sizing: border-box;
display: block;
font-size: 0.95rem;
letter-spacing: 0.03rem;
font-weight: 900;
margin-bottom: 0.6rem;
}
main article#top p,
main article#top li,
main article#top dt,
main article#top dd {
font-size: 0.95rem;
line-height: 1.4rem;
}
main article#top p .tx-caption,
main article#top li .tx-caption,
main article#top dt .tx-caption,
main article#top dd .tx-caption {
font-size: 0.75rem;
}
main article#top p.tx-caption {
font-size: 0.75rem;
}
main article#top .tx-block {
margin-bottom: 0.9rem;
}
main article#page h2 {
font-size: 1.7rem;
line-height: 1.9rem;
}
main article#page h2:before {
bottom: -5px;
border-bottom: 5px solid #d8000f;
}
main article#page h2:after {
bottom: -5px;
border-bottom: 5px solid #1b1c81;
}
main article#page h3 {
font-size: 1.4rem;
line-height: 1.8rem;
margin-bottom: 1.6rem;
}
main article#page h3 span {
font-size: 1.4rem;
line-height: 1.6rem;
}
main article#page h4 {
font-size: 1.2rem;
line-height: 1.4rem;
margin-bottom: 1.3rem;
}
main article#page h5 {
font-size: 1rem;
}
main article#page p,
main article#page li,
main article#page dt,
main article#page dd {
font-size: 0.95rem !important;
line-height: 1.4rem !important;
}
main article#page p .tx-caption,
main article#page li .tx-caption,
main article#page dt .tx-caption,
main article#page dd .tx-caption {
font-size: 0.75rem;
}
main article#page p.tx-caption {
font-size: 0.75rem;
}
main article#page .tx-block {
margin-bottom: 0.9rem;
}
}
/* TOP
--------------------------------------------------------------------------*/
main article#top section .cnt-layout-cmn {
position: relative;
box-sizing: border-box;
width: 90%;
margin: 0 5%;
}
main article#top section .cnt-layout-cmn h3 {
font-size: 1.8rem;
line-height: 2.4rem;
letter-spacing: 0.05rem;
}
.contact-ttl {
position: relative;
box-sizing: border-box;
text-align: center;
margin-bottom: 2rem;
}
.contact-box {
position: relative;
box-sizing: border-box;
display: flex;
width: 60%;
margin: 0 20%;
}
.contact-box div.contact-content {
width: 46%;
margin: 0 2%;
}
.contact-box div.contact-content a {
position: relative;
box-sizing: border-box;
display: block;
overflow: hidden;
background: #efc138;
color: #000;
text-decoration: none;
text-align: center;
padding: 10% 10%;
}
.contact-box div.contact-content a h4 {
font-weight: normal !important;
margin-bottom: 0.5rem !important;
}
.contact-box div.contact-content a h5 {
font-size: 2rem !important;
}
.contact-box div.contact-content a picture {
position: relative;
box-sizing: border-box;
display: block;
width: 30%;
margin: 0 35% 1rem 35%;
}
.contact-box div.contact-content a picture img {
width: 100%;
}
section#cnt-picture ul {
display: flex;
flex-wrap: wrap;
}
section#cnt-picture ul li {
width: 33.33333333%;
}
main article#top section .cnt-layout1 {
position: relative;
box-sizing: border-box;
width: 100%;
display: flex;
}
main article#top section .cnt-layout1 div.cnt-text {
position: relative;
box-sizing: border-box;
display: block;
width: 80%;
margin-top: 3rem;
margin-left: 20%;
background: #f6f9fb;
padding: 6rem 5% 6rem 25%;
}
main article#top section .cnt-layout1 div.cnt-text h3 {
font-size: 2.1rem;
line-height: 3rem;
margin-bottom: 2rem;
letter-spacing: 0.2rem;
}
main article#top section .cnt-layout1 div.cnt-text h3 span {
font-size: 1.6rem;
font-weight: 600;
margin-right: 1rem;
}
main article#top section .cnt-layout1 div.cnt-text h4 {
font-size: 1.2rem;
font-weight: 500 !important;
line-height: 1.6rem;
margin-bottom: 1rem;
letter-spacing: 0.1rem;
}
main article#top section .cnt-layout1 div.cnt-text p.cnt-text-ttl-sub {
font-size: 1.1rem;
margin-bottom: 1.2rem;
letter-spacing: 0.1rem;
}
main article#top section .cnt-layout1 div.cnt-text p {
margin-bottom: 1rem;
}
main article#top section .cnt-layout1 div.cnt-text .cnt-bt {
width: 30%;
margin: 1.5rem 0 0 70%;
}
main article#top section .cnt-layout1 div.cnt-picture {
position: absolute;
box-sizing: border-box;
display: block;
width: 40%;
top: 0;
left: 0;
}
main article#top section .cnt-layout1 div.cnt-picture img {
display: block;
}
@media screen and (max-width: 1150px) {
main article#top section .cnt-layout1 div.cnt-text {
padding: 4rem 5% 4rem 25%;
}
main article#top section .cnt-layout1 div.cnt-text .cnt-bt {
width: 50%;
margin: 1.5rem 0 0 50%;
}
}
@media screen and (max-width: 751px) {
main article#top section .cnt-layout1 {
display: block;
}
main article#top section .cnt-layout1 div.cnt-text {
width: 94%;
margin-top: 2vw;
margin-left: 6%;
padding: 8vw 10% 14vw 10%;
}
main article#top section .cnt-layout1 div.cnt-text h3 {
font-size: 6vw;
line-height: 7.8vw;
margin-bottom: 5vw;
letter-spacing: 0.5vw;
}
main article#top section .cnt-layout1 div.cnt-text h3 span {
font-size: 4.5vw;
margin-right: 2vw;
}
main article#top section .cnt-layout1 div.cnt-text h4 {
font-size: 1rem;
line-height: 1.5rem;
margin-bottom: 0.7rem;
letter-spacing: 0.1rem;
font-weight: normal;
}
main article#top section .cnt-layout1 div.cnt-text p.cnt-text-ttl-sub {
font-size: 3.6vw;
line-height: 4.8vw;
margin-bottom: 4vw;
letter-spacing: 0.5vw;
}
main article#top section .cnt-layout1 div.cnt-text p {
font-size: 0.9rem;
margin-bottom: 1rem;
}
main article#top section .cnt-layout1 div.cnt-text .cnt-bt {
width: 80%;
margin: 1.5rem 10% 0 10%;
}
main article#top section .cnt-layout1 div.cnt-text .cnt-bt a {
font-size: 3.2vw;
}
main article#top section .cnt-layout1 div.cnt-picture {
position: relative;
width: 90%;
top: -7vw;
left: 0;
}
}
main article#top section .cnt-layout2 {
position: relative;
box-sizing: border-box;
width: 100%;
display: flex;
}
main article#top section .cnt-layout2 div.cnt-text {
position: relative;
box-sizing: border-box;
display: block;
width: 80%;
margin-top: 3rem;
margin-right: 20%;
background: #262626;
padding: 6rem 25% 6rem 5%;
}
main article#top section .cnt-layout2 div.cnt-text h3 {
font-size: 2.1rem;
line-height: 3rem;
margin-bottom: 2rem;
letter-spacing: 0.2rem;
color: #FFF;
}
main article#top section .cnt-layout2 div.cnt-text h3 span {
font-size: 1.6rem;
font-weight: 600;
margin-right: 1rem;
}
main article#top section .cnt-layout2 div.cnt-text h4 {
font-size: 1.2rem;
font-weight: 500 !important;
line-height: 1.6rem;
margin-bottom: 1rem;
letter-spacing: 0.1rem;
color: #FFF;
}
main article#top section .cnt-layout2 div.cnt-text p.cnt-text-ttl-sub {
font-size: 1.1rem;
margin-bottom: 1.2rem;
letter-spacing: 0.1rem;
color: #FFF;
}
main article#top section .cnt-layout2 div.cnt-text p {
margin-bottom: 1rem;
color: #FFF;
}
main article#top section .cnt-layout2 div.cnt-text .cnt-bt {
width: 30%;
margin: 1.5rem 70% 0 0;
}
main article#top section .cnt-layout2 div.cnt-picture {
position: absolute;
box-sizing: border-box;
display: block;
width: 40%;
top: 0;
right: 0;
}
main article#top section .cnt-layout2 div.cnt-picture img {
display: block;
}
@media screen and (max-width: 1150px) {
main article#top section .cnt-layout2 div.cnt-text {
padding: 4rem 25% 4rem 5%;
}
main article#top section .cnt-layout2 div.cnt-text .cnt-bt {
width: 50%;
margin: 1.5rem 50% 0 0;
}
}
@media screen and (max-width: 751px) {
main article#top section .cnt-layout2 {
display: block;
}
main article#top section .cnt-layout2 div.cnt-text {
width: 94%;
margin-top: 2vw;
margin-left: 6%;
padding: 8vw 10% 14vw 10%;
}
main article#top section .cnt-layout2 div.cnt-text h3 {
font-size: 6vw;
line-height: 7.8vw;
margin-bottom: 5vw;
letter-spacing: 0.5vw;
}
main article#top section .cnt-layout2 div.cnt-text h3 span {
font-size: 4.5vw;
margin-right: 2vw;
}
main article#top section .cnt-layout2 div.cnt-text h4 {
font-size: 1rem;
line-height: 1.5rem;
margin-bottom: 0.7rem;
letter-spacing: 0.1rem;
font-weight: normal;
}
main article#top section .cnt-layout2 div.cnt-text p.cnt-text-ttl-sub {
font-size: 3.6vw;
line-height: 4.8vw;
margin-bottom: 4vw;
letter-spacing: 0.5vw;
}
main article#top section .cnt-layout2 div.cnt-text p {
font-size: 0.9rem;
margin-bottom: 1rem;
}
main article#top section .cnt-layout2 div.cnt-text .cnt-bt {
width: 80%;
margin: 1.5rem 10% 0 10%;
}
main article#top section .cnt-layout2 div.cnt-text .cnt-bt a {
font-size: 3.2vw;
}
main article#top section .cnt-layout2 div.cnt-picture {
position: relative;
width: 90%;
top: -7vw;
margin-right: 10%;
}
}
main article#top section .cnt-layout3 {
position: relative;
box-sizing: border-box;
width: 100%;
margin-top: 3rem;
overflow: hidden;
}
main article#top section .cnt-layout3 div.cnt-text {
position: relative;
box-sizing: border-box;
display: block;
width: 25%;
margin-left: 75%;
margin-bottom: 8rem;
padding: 0 10% 0 8%;
writing-mode: vertical-rl;
text-align: left;
display: inline-block;
}
main article#top section .cnt-layout3 div.cnt-text h3 {
font-size: 2.1rem;
line-height: 3rem;
margin-left: 3rem;
letter-spacing: 0.2rem;
display: block;
}
main article#top section .cnt-layout3 div.cnt-text h3 span {
font-size: 1.6rem;
font-weight: 600;
margin-right: 1rem;
}
main article#top section .cnt-layout3 div.cnt-text h4 {
font-size: 1.2rem;
font-weight: 500 !important;
line-height: 1.6rem;
margin-left: 1.4rem;
letter-spacing: 0.1rem;
display: block;
}
main article#top section .cnt-layout3 div.cnt-text p.cnt-text-ttl-sub {
font-size: 1.2rem;
margin-left: 2rem;
letter-spacing: 0.1rem;
display: block;
}
main article#top section .cnt-layout3 div.cnt-text p {
margin-left: 1rem;
display: block;
height: 36rem;
}
main article#top section .cnt-layout3 div.cnt-picture {
position: absolute;
box-sizing: border-box;
display: block;
width: 80%;
padding: 0 7% 0 7%;
top: 0;
left: 0;
}
main article#top section .cnt-layout3 div.cnt-picture img {
display: block;
}
main article#top section .cnt-layout3 .cnt-bt {
width: 16%;
margin: 1.5rem 8% 0 76%;
}
@media screen and (max-width: 1600px) {
main article#top section .cnt-layout3 {
margin-top: 3vw;
}
main article#top section .cnt-layout3 div.cnt-text {
margin-bottom: 5vw;
}
main article#top section .cnt-layout3 div.cnt-text p {
height: 46vw;
}
main article#top section .cnt-layout3 .cnt-bt {
width: 40%;
margin: 1.5rem 30% 0 30%;
}
main article#top section .cnt-layout3 div.cnt-picture {
width: 80vw;
padding: 0 7% 0 7%;
top: 0;
left: 0;
}
}
@media screen and (max-width: 1200px) {
main article#top section .cnt-layout3 div.cnt-text {
margin-bottom: 5vw;
}
main article#top section .cnt-layout3 div.cnt-text p {
height: 40vw;
}
main article#top section .cnt-layout3 .cnt-bt {
width: 40%;
margin: 1.5rem 30% 0 30%;
}
main article#top section .cnt-layout3 div.cnt-picture {
width: 70vw;
padding: 0 7% 0 7%;
top: 0;
left: 0;
}
}
@media screen and (max-width: 900px) {
main article#top section .cnt-layout3 div.cnt-text {
margin-bottom: 5vw;
}
main article#top section .cnt-layout3 div.cnt-text p {
height: 46vw;
}
main article#top section .cnt-layout3 .cnt-bt {
width: 40%;
margin: 1.5rem 30% 0 30%;
}
main article#top section .cnt-layout3 div.cnt-picture {
width: 60vw;
padding: 0 7% 0 7%;
top: 0;
left: 0;
}
}
@media screen and (max-width: 751px) {
main article#top section .cnt-layout3 div.cnt-text {
position: relative;
box-sizing: border-box;
width: 90%;
height: 50vw;
margin: 0 5%;
margin-bottom: 15vw;
padding: 0 8% 0 8%;
writing-mode: horizontal-tb;
display: block;
vertical-align: top;
overflow: hidden;
}
main article#top section .cnt-layout3 div.cnt-text h3 {
position: absolute;
font-size: 7vw;
letter-spacing: 0.5vw;
display: block;
writing-mode: vertical-lr;
top: 0;
left: 38vw;
margin: 0 auto 5vw auto;
}
main article#top section .cnt-layout3 div.cnt-text h3 span {
font-size: 4.5vw;
margin-right: 2vw;
}
main article#top section .cnt-layout3 div.cnt-text h4 {
font-size: 1.2rem;
font-weight: 500 !important;
line-height: 1.6rem;
margin-left: 1.4rem;
letter-spacing: 0.1rem;
display: block;
}
main article#top section .cnt-layout3 div.cnt-text p {
margin: 56vw 0 0 0;
display: block;
width: 100%;
height: auto;
}
main article#top section .cnt-layout3 div.cnt-text p.cnt-text-ttl-sub {
position: absolute;
font-size: 3.2vw;
margin-bottom: 4vw;
letter-spacing: 0.5vw;
writing-mode: vertical-lr;
width: auto;
top: 0;
left: 48vw;
margin: 0 auto 5vw auto;
}
main article#top section .cnt-layout3 div.cnt-picture {
position: relative;
width: 90%;
top: -7vw;
margin-right: 10%;
}
main article#top section .cnt-layout3 .cnt-bt {
width: 60%;
margin: 0 20% 0 20%;
}
main article#top section .cnt-layout3 .cnt-bt a {
font-size: 3.2vw;
}
}
main article#top section .cnt-layout4 {
position: relative;
box-sizing: border-box;
width: 100%;
overflow: hidden;
}
main article#top section .cnt-layout4 div.cnt-text {
position: absolute;
box-sizing: border-box;
display: block;
width: 36%;
margin: 0 32%;
padding: 10rem 3%;
text-align: center;
z-index: 2;
}
main article#top section .cnt-layout4 div.cnt-text h3 {
font-size: 2.1rem;
line-height: 3rem;
margin-bottom: 2rem;
letter-spacing: 0.2rem;
display: inline-block;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
}
main article#top section .cnt-layout4 div.cnt-text h3 span {
font-size: 1.6rem;
font-weight: 600;
margin-right: 1rem;
}
main article#top section .cnt-layout4 div.cnt-text h4 {
font-size: 1.2rem;
font-weight: 500 !important;
line-height: 1.6rem;
margin-bottom: 1rem;
letter-spacing: 0.1rem;
display: block;
}
main article#top section .cnt-layout4 div.cnt-text p.cnt-text-ttl-sub {
font-size: 1.2rem;
margin-bottom: : 2rem;
letter-spacing: 0.1rem;
display: block;
}
main article#top section .cnt-layout4 div.cnt-text p {
margin-bottom: 1rem;
display: block;
}
main article#top section .cnt-layout4 div.cnt-text .cnt-bt {
width: 70% !important;
margin: 1.5rem 15% 0 15% !important;
}
main article#top section .cnt-layout4 div.cnt-picture {
position: relative;
box-sizing: border-box;
display: block;
width: 100%;
padding: 0;
top: 0;
left: 0;
}
main article#top section .cnt-layout4 div.cnt-picture img {
display: block;
}
@media screen and (max-width: 1600px) {
main article#top section .cnt-layout4 {
position: relative;
box-sizing: border-box;
width: 100%;
overflow: hidden;
}
main article#top section .cnt-layout4 div.cnt-text {
position: absolute;
box-sizing: border-box;
display: block;
width: 36%;
margin: 0 32%;
padding: 10vw 3%;
text-align: center;
z-index: 2;
}
main article#top section .cnt-layout4 div.cnt-text h3 {
font-size: 2.1rem;
line-height: 3rem;
margin-bottom: 2rem;
letter-spacing: 0.2rem;
display: inline-block;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
}
main article#top section .cnt-layout4 div.cnt-text h3 span {
font-size: 1.6rem;
font-weight: 600;
margin-right: 1rem;
}
main article#top section .cnt-layout4 div.cnt-text h4 {
font-size: 1.2rem;
font-weight: 500 !important;
line-height: 1.6rem;
margin-bottom: 1rem;
letter-spacing: 0.1rem;
display: block;
}
main article#top section .cnt-layout4 div.cnt-text p.cnt-text-ttl-sub {
font-size: 1.2rem;
margin-bottom: : 2rem;
letter-spacing: 0.1rem;
display: block;
}
main article#top section .cnt-layout4 div.cnt-text p {
margin-bottom: 1rem;
display: block;
}
main article#top section .cnt-layout4 div.cnt-text .cnt-bt {
width: 50% !important;
margin: 1.5rem 25% 0 25% !important;
}
main article#top section .cnt-layout4 div.cnt-picture {
position: relative;
box-sizing: border-box;
display: block;
width: 100%;
padding: 0;
top: 0;
left: 0;
}
main article#top section .cnt-layout4 div.cnt-picture img {
display: block;
}
}
@media screen and (max-width: 940px) {
main article#top section .cnt-layout4 div.cnt-text {
position: relative;
box-sizing: border-box;
display: block;
width: 90%;
margin: 0 5%;
padding: 0 3% 5vw 3%;
text-align: center;
z-index: 2;
}
main article#top section .cnt-layout4 div.cnt-text .cnt-bt {
width: 40%;
margin: 1.5rem 30% 0 30%;
}
main article#top section .cnt-layout4 div.cnt-picture {
position: relative;
box-sizing: border-box;
display: block;
width: 100%;
padding: 0;
top: 0;
left: 0;
}
main article#top section .cnt-layout4 div.cnt-picture img {
display: block;
}
}
@media screen and (max-width: 751px) {
main article#top section .cnt-layout4 div.cnt-text {
position: relative;
box-sizing: border-box;
display: block;
width: 90%;
height: 72vw;
margin: 0 5%;
padding: 7vw 3% 5vw 3%;
text-align: center;
z-index: 2;
}
main article#top section .cnt-layout4 div.cnt-text h3 {
position: absolute;
font-size: 6vw;
line-height: 7.8vw;
letter-spacing: 0.5vw;
display: block;
writing-mode: vertical-lr;
top: 2vw;
left: 38vw;
margin: 0 auto 5vw auto;
}
main article#top section .cnt-layout4 div.cnt-text h3 span {
font-size: 4.5vw;
margin-right: 2vw;
}
main article#top section .cnt-layout4 div.cnt-text h4 {
position: relative;
font-size: 1rem;
line-height: 1.5rem;
margin-top: 22vw;
margin-bottom: 0.7rem;
letter-spacing: 0.1rem;
font-weight: normal;
}
main article#top section .cnt-layout4 div.cnt-text p.cnt-text-ttl-sub {
font-size: 1.2rem;
margin-bottom: : 2rem;
letter-spacing: 0.1rem;
display: block;
}
main article#top section .cnt-layout4 div.cnt-text p {
font-size: 0.9rem;
margin-bottom: 1rem;
text-align: left;
}
main article#top section .cnt-layout4 div.cnt-text .cnt-bt {
width: 70% !important;
margin: 1.5rem 15% 0 15% !important;
}
main article#top section .cnt-layout4 div.cnt-picture {
position: relative;
box-sizing: border-box;
display: block;
width: 100%;
padding: 0;
top: 0;
left: 0;
}
main article#top section .cnt-layout4 div.cnt-picture img {
display: block;
}
}
@media screen and (max-width: 751px) {
main article section#cnt01 {
padding: 5vw 0 5vw 0;
}
main article section#cnt02 {
padding: 0 0 5vw 0;
}
main article section#cnt03 {
padding: 0 0 5vw 0;
}
main article section#cnt04 {
padding: 0 0 5vw 0;
}
main article section#cnt05 {
padding: 0 0 5vw 0;
}
}
section.page-box {
position: relative;
box-sizing: border-box;
padding: 5rem 8% 2rem 8%;
background: #FFF;
}
section.page-box .cnt-box {
position: relative;
box-sizing: border-box;
display: block;
width: 100%;
margin-bottom: 2rem;
}
section.page-box .cnt-box .cnt-l {
float: left;
width: 48%;
}
section.page-box .cnt-box .cnt-r {
float: right;
width: 48%;
}
section#cnt01 {
position: relative;
box-sizing: border-box;
}
section#cnt01 .cnt-box {
position: relative;
box-sizing: border-box;
display: block;
width: 47%;
margin: 0 10% 0 43%;
}
section#cnt01 .cnt-box .pre-name {
text-align: right;
margin-bottom: 2rem;
}
section#cnt01 .ds-tx {
position: absolute;
top: 50%;
right: -4rem;
transform: rotate(-90deg);
font-size: 0.8rem;
opacity: 0.7;
}
section#cnt01 .master {
display: none;
}
section#cnt01 {
position: relative;
box-sizing: border-box;
}
section#cnt02 {
position: relative;
box-sizing: border-box;
}
section#cnt03 {
position: relative;
box-sizing: border-box;
}
section#cnt04 {
position: relative;
box-sizing: border-box;
}
section#cnt05 {
position: relative;
box-sizing: border-box;
}
section#cnt06 {
position: relative;
box-sizing: border-box;
width: 100%;
padding: 9rem 0 9rem 0;
background: url("../img/info-bg.png") #335b9c;
background-position: center bottom;
background-size: 1980px 800px;
background-repeat: no-repeat;
display: flex;
align-items: center;
}
section#cnt06 .cnt-box {
position: relative;
box-sizing: border-box;
width: 40%;
margin: 0 52% 0 8%;
color: #FFF;
}
section#cnt06 .cnt-box p {
color: #FFF !important;
}
@media screen and (max-width: 1000px) {
section#cnt06 {
position: relative;
box-sizing: border-box;
width: 100%;
padding: 10% 0 9rem 0;
background: url("../img/sp-info-bg.png") #335b9c;
background-position: center bottom;
background-size: 100%;
background-repeat: no-repeat;
display: flex;
align-items: center;
}
section#cnt06 .cnt-box {
position: relative;
box-sizing: border-box;
width: 80%;
margin: 0 10% 25vw 10%;
color: #FFF;
}
section#cnt06 .cnt-box p {
color: #FFF !important;
}
}
@media screen and (max-width: 751px) {
section#cnt06 .cnt-box {
margin: 0 10% 15vw 10%;
}
}
section#gmap {
position: relative;
box-sizing: border-box;
width: 100%;
padding: 0;
margin-bottom: -5px;
}
/* Header
--------------------------------------------------------------------------*/
header {
position: relative;
box-sizing: border-box;
display: block;
width: 100%;
max-width: 100rem;
margin: auto;
}
header h1.hd-logo {
position: absolute;
box-sizing: border-box;
display: block;
width: 8%;
top: 0;
right: 0;
height: 35rem;
overflow: hidden;
display: flex;
align-items: center;
}
header h1.hd-logo a {
position: absolute;
display: block;
top: 0;
right: 0;
width: 100%;
}
header h1.hd-logo a picture {
border-right: 0.8rem solid #efc138;
padding: 1rem 1rem;
display: block;
}
header h1.hd-logo a picture img {
display: block;
}
header .hd-wrap {
position: fixed;
box-sizing: border-box;
width: 100%;
max-width: 100rem;
height: 3.4375rem;
display: block;
margin: auto;
}
header .hd-wrap .hd-tel-i .hd-tel-i-button {
position: absolute;
box-sizing: border-box;
top: 3.4375rem;
left: 0;
width: 3.4375rem;
height: 3.4375rem;
padding: 0.7rem;
background: #000;
cursor: pointer;
transition: all 0.5s;
z-index: 50;
}
header .hd-wrap .hd-tel-i .hd-tel-i-button:hover {
background: #333;
}
header .hd-wrap .hd-map-i .hd-map-i-button {
position: absolute;
box-sizing: border-box;
top: 6.875rem;
left: 0;
width: 3.4375rem;
height: 3.4375rem;
padding: 0.7rem;
background: #000;
transition: all 0.5s;
z-index: 50;
}
header .hd-wrap .hd-map-i .hd-map-i-button:hover {
background: #333;
}
header .hd-eng {
position: absolute;
box-sizing: border-box;
display: block;
height: 60rem;
left: 1.2rem;
top: 0;
overflow: hidden;
font-size: 0.75rem;
letter-spacing: 0.1rem;
writing-mode: vertical-rl;
text-align: right;
z-index: -1;
}
.top header h1.hd-logo {
width: 10%;
top: 0;
right: 0;
height: 61rem;
}
.top header h1.hd-logo a {
position: absolute;
bottom: 0;
top: auto;
right: 0;
width: 100%;
}
.top header h1.hd-logo a picture {
border-right: 0.8rem solid #efc138;
padding: 0 1rem;
}
.top header .hd-eng {
position: absolute;
box-sizing: border-box;
display: block;
height: 60rem;
left: 1.2rem;
top: 0;
overflow: hidden;
font-size: 0.75rem;
letter-spacing: 0.1rem;
writing-mode: vertical-rl;
text-align: right;
z-index: -1;
}
@media screen and (max-width: 1615px) {
header {
position: relative;
box-sizing: border-box;
display: block;
width: 100%;
max-width: 100rem;
margin: auto;
}
header h1.hd-logo {
width: 9%;
top: 0;
right: 0;
height: 35vw;
}
header h1.hd-logo a {
position: absolute;
display: block;
top: 0;
right: 0;
width: 100%;
}
header h1.hd-logo a picture {
border-right: 0.8vw solid #efc138;
padding: 1rem 1rem;
display: block;
}
header h1.hd-logo a picture img {
display: block;
}
header .hd-eng {
height: 59.5vw;
left: 1.2rem;
font-size: 0.75rem;
letter-spacing: 0.1rem;
}
header .hd-wrap {
position: fixed;
box-sizing: border-box;
width: 100%;
max-width: 100rem;
height: 3.4375rem;
display: block;
margin: auto;
}
header .hd-wrap .hd-tel-i .hd-tel-i-button {
position: absolute;
box-sizing: border-box;
top: 3.4375rem;
left: 0;
width: 3.4375rem;
height: 3.4375rem;
padding: 0.7rem;
background: #000;
cursor: pointer;
transition: all 0.5s;
z-index: 50;
}
header .hd-wrap .hd-tel-i .hd-tel-i-button:hover {
background: #333;
}
header .hd-wrap .hd-map-i .hd-map-i-button {
position: absolute;
box-sizing: border-box;
top: 6.875rem;
left: 0;
width: 3.4375rem;
height: 3.4375rem;
padding: 0.7rem;
background: #000;
transition: all 0.5s;
z-index: 50;
}
header .hd-wrap .hd-map-i .hd-map-i-button:hover {
background: #333;
}
.top header h1.hd-logo {
width: 10%;
top: 0;
right: 0;
height: 60.4vw;
}
.top header h1.hd-logo a {
position: absolute;
bottom: 0;
top: auto;
right: 0;
width: 100%;
}
.top header h1.hd-logo a picture {
border-right: 0.8vw solid #efc138;
padding: 0 1rem;
}
.top header .hd-eng {
height: 59.5vw;
left: 1.2rem;
font-size: 0.75rem;
letter-spacing: 0.1rem;
}
}
@media screen and (max-width: 1000px) {
header h1.hd-logo {
width: 12%;
top: 0;
right: 0;
height: 35vw;
}
header h1.hd-logo a {
position: absolute;
display: block;
top: 0;
right: 0;
width: 100%;
}
header h1.hd-logo a picture {
border-right: 0.8vw solid #efc138;
padding: 1rem 1rem;
display: block;
}
header h1.hd-logo a picture img {
display: block;
}
header .hd-wrap {
position: fixed;
box-sizing: border-box;
width: 100%;
max-width: 100rem;
height: 3rem;
display: block;
margin: auto;
}
header .hd-wrap .hd-tel-i .hd-tel-i-button {
position: absolute;
box-sizing: border-box;
top: 3rem;
left: 0;
width: 3rem;
height: 3rem;
padding: 0.7rem;
background: #000;
cursor: pointer;
transition: all 0.5s;
z-index: 50;
}
header .hd-wrap .hd-tel-i .hd-tel-i-button:hover {
background: #333;
}
header .hd-wrap .hd-map-i .hd-map-i-button {
position: absolute;
box-sizing: border-box;
top: 6rem;
left: 0;
width: 3rem;
height: 3rem;
padding: 0.7rem;
background: #000;
cursor: pointer;
transition: all 0.5s;
z-index: 50;
}
header .hd-wrap .hd-map-i .hd-map-i-button:hover {
background: #333;
}
.top header h1.hd-logo {
width: 14%;
top: 0;
right: 0;
height: 57vw;
}
.top header h1.hd-logo a {
position: absolute;
bottom: 0;
top: auto;
right: 0;
width: 100%;
}
.top header h1.hd-logo a picture {
border-right: 0.8vw solid #efc138;
padding: 0 1rem;
}
}
@media screen and (max-width: 751px) {
header h1.hd-logo {
width: 16%;
top: 0;
right: 0;
height: 40vw;
}
header h1.hd-logo a {
position: absolute;
display: block;
top: 0;
right: 0;
width: 100%;
}
header h1.hd-logo a picture {
border-right: 0.8vw solid #efc138;
padding: 1rem 1rem;
display: block;
}
header h1.hd-logo a picture img {
display: block;
}
header .hd-eng {
height: 120vw;
left: 1rem;
font-size: 2vw;
letter-spacing: 0.3vw;
}
.top header h1.hd-logo {
width: 16%;
top: 0;
right: 0;
height: 40vw;
}
.top header h1.hd-logo a {
position: absolute;
display: block;
top: 0;
right: 0;
width: 100%;
}
.top header h1.hd-logo a picture {
border-right: 0.8vw solid #efc138;
padding: 1rem 1rem;
display: block;
}
.top header h1.hd-logo a picture img {
display: block;
}
.top header .hd-eng {
height: 120vw;
left: 1rem;
font-size: 2vw;
letter-spacing: 0.3vw;
}
}
/* MENU */
#sidebarMenu {
position: relative;
box-sizing: border-box;
width: 100%;
text-align: right;
padding: 1rem 0rem 1rem 12.5rem;
}
#sidebarMenu {
position: fixed;
top: 0;
left: 0%;
width: 100%;
height: 100vh;
padding: 0;
margin: 0;
transform: translateX(-100%);
transition: transform 250ms ease-in-out;
background: rgba(246, 244, 240, 0.98);
overflow: auto;
z-index: 100;
}
.sidebarMenuInner {
position: relative;
width: 96%;
max-width: 30rem;
margin: 0 auto;
padding: 0 ;
}
.sidebarMenuInner li {
display: block;
list-style: none;
color: #000;
opacity: 0;
transform: translateX(-3rem);
transition: all 0.8s;
}
.sidebarMenuInner li a {
position: relative;
box-sizing: border-box;
display: block;
width: 100%;
color: #000;
text-align: center;
cursor: pointer;
text-decoration: none;
padding: 0.6rem 1.5rem 0.8rem 1.5rem;
margin: 0;
border-bottom: dotted 1px #c2beb5;
transition: all 0.3s;
}
.sidebarMenuInner li a:hover {
color: #ff6000;
}
.sidebarMenuInner li label {
position: relative;
box-sizing: border-box;
display: block;
width: 100%;
color: #FFF;
font-size: 1.3rem;
font-weight: 900;
text-align: center;
cursor: pointer;
text-decoration: none;
padding: 1.1rem 1.5rem 1.3rem 1.5rem;
margin: 0;
border-bottom: dotted 1px #c2beb5;
transition: all 0.3s;
}
.sidebarMenuInner li label:hover {
color: #ff6000;
}
.sidebarMenuInner li span {
display: block;
color: #FFF;
padding: 20px;
}
.sidebarMenuInner li.in a {
color: #5e5e5e;
}
.sidebarMenuInner li.hd-menu-contact {
margin-right: auto;
}
.sidebarMenuInner li.hd-menu-contact a {
border: none;
margin-top: 2rem;
}
.sidebarMenu-logo {
display: block;
width: 30%;
max-width: 3rem;
margin: 2rem auto 1rem auto;
text-align: center;
}
.sidebarMenu-logo img {
width: 100%;
}
.hd-tel-in {
display: block;
width: 60%;
max-width: 18rem;
margin: 0.8rem auto 0rem auto;
text-align: center;
opacity: 0;
transform: translateX(-3rem);
transition: all 0.8s;
}
.hd-tel-in a {
position: relative;
box-sizing: border-box;
display: block;
width: 96%;
max-width: 30rem;
padding: 0.8rem 1.5rem 1rem 1.5rem;
margin: 0 auto 0 auto;
border: dotted 1px #c2beb5;
background: rgba(255, 255, 255, 0.5);
display: flex;
justify-content: center;
align-items: center;
color: #000;
text-align: center;
vertical-align: middle;
text-decoration: none;
}
.hd-tel-in h5 {
font-weight: 900;
color: #FFFFFF;
font-size: 1.3rem;
}
.hd-tel-in ul {
width: 100%;
max-width: 10rem;
margin: auto;
display: flex;
}
.hd-tel-in ul li {
box-sizing: border-box;
width: 50%;
padding: 0.5rem;
}
.hd-tel-in ul li a {
display: block;
}
input[type="checkbox"]:checked ~ #sidebarMenu {
transform: translateX(0);
}
input[type="checkbox"]:checked ~ #sidebarMenu > .sidebarMenuInner li:nth-child(1) {
-webkit-animation: example 0.3s ease 0.3s 1 forwards;
animation: example 0.3s ease 0.3s 1 forwards;
}
input[type="checkbox"]:checked ~ #sidebarMenu > .sidebarMenuInner li:nth-child(2) {
-webkit-animation: example 0.3s ease 0.5s 1 forwards;
animation: example 0.3s ease 0.5s 1 forwards;
}
input[type="checkbox"]:checked ~ #sidebarMenu > .sidebarMenuInner li:nth-child(3) {
-webkit-animation: example 0.3s ease 0.6s 1 forwards;
animation: example 0.3s ease 0.6s 1 forwards;
}
input[type="checkbox"]:checked ~ #sidebarMenu > .sidebarMenuInner li:nth-child(4) {
-webkit-animation: example 0.3s ease 0.7s 1 forwards;
animation: example 0.3s ease 0.7s 1 forwards;
}
input[type="checkbox"]:checked ~ #sidebarMenu > .sidebarMenuInner li:nth-child(5) {
-webkit-animation: example 0.3s ease 0.8s 1 forwards;
animation: example 0.3s ease 0.8s 1 forwards;
}
input[type="checkbox"]:checked ~ #sidebarMenu > .sidebarMenuInner li:nth-child(6) {
-webkit-animation: example 0.3s ease 0.9s 1 forwards;
animation: example 0.3s ease 0.9s 1 forwards;
}
input[type="checkbox"]:checked ~ #sidebarMenu > .sidebarMenuInner li:nth-child(7) {
-webkit-animation: example 0.3s ease 1s 1 forwards;
animation: example 0.3s ease 1s 1 forwards;
}
input[type="checkbox"]:checked ~ #sidebarMenu > .sidebarMenuInner li:nth-child(8) {
-webkit-animation: example 0.3s ease 1.1s 1 forwards;
animation: example 0.3s ease 1.1s 1 forwards;
}
input[type="checkbox"]:checked ~ #sidebarMenu > .sidebarMenuInner li:nth-child(9) {
-webkit-animation: example 0.3s ease 1.2s 1 forwards;
animation: example 0.3s ease 1.2s 1 forwards;
}
input[type="checkbox"]:checked ~ #sidebarMenu > .sidebarMenuInner li:nth-child(10) {
-webkit-animation: example 0.3s ease 1.3s 1 forwards;
animation: example 0.3s ease 1.3s 1 forwards;
}
input[type="checkbox"]:checked ~ #sidebarMenu > .sidebarMenuInner li:nth-child(11) {
-webkit-animation: example 0.3s ease 1.4s 1 forwards;
animation: example 0.3s ease 1.4s 1 forwards;
}
input[type="checkbox"]:checked ~ #sidebarMenu > .sidebarMenuInner li:nth-child(12) {
-webkit-animation: example 0.3s ease 1.5s 1 forwards;
animation: example 0.3s ease 1.5s 1 forwards;
}
input[type="checkbox"]:checked ~ #sidebarMenu > div.hd-tel-in {
-webkit-animation: example 0.3s ease 1.6s 1 forwards;
animation: example 0.3s ease 1.6s 1 forwards;
}
input[type=checkbox] {
transition: all 0.3s;
box-sizing: border-box;
display: none;
}
.sidebarIconToggle {
position: fixed;
display: block;
box-sizing: border-box;
cursor: pointer;
position: absolute;
z-index: 206;
top: 0;
left: 0;
width: 3.4375rem;
height: 3.4375rem;
padding: 1.3rem 0.8rem;
background: #efc138;
transition: all 0.3s;
}
.spinner {
transition: all 0.3s;
box-sizing: border-box;
position: absolute;
height: 0.05rem;
border-radius: 0.2rem;
width: 100%;
background-color: #000;
}
.horizontal {
transition: all 0.3s;
box-sizing: border-box;
position: relative;
float: left;
margin-top: 0.4rem;
}
.diagonal.part-1 {
position: relative;
transition: all 0.3s;
box-sizing: border-box;
float: left;
background-color: #000;
}
.diagonal.part-2 {
transition: all 0.3s;
box-sizing: border-box;
position: relative;
float: left;
margin-top: 0.6rem;
background-color: #000;
}
input[type=checkbox]:checked ~ .sidebarIconToggle > .horizontal {
transition: all 0.3s;
box-sizing: border-box;
opacity: 0;
}
input[type=checkbox]:checked ~ .sidebarIconToggle > .diagonal.part-1 {
transition: all 0.3s;
box-sizing: border-box;
transform: rotate(135deg);
margin-top: 1rem;
background-color: #000;
}
input[type=checkbox]:checked ~ .sidebarIconToggle > .diagonal.part-2 {
transition: all 0.3s;
box-sizing: border-box;
transform: rotate(-135deg);
margin-top: -0.15rem;
background-color: #000;
}
input[type=checkbox]:checked ~ .sidebarIconToggle {
padding: 0.7rem 0.8rem 0.8rem 0.8rem;
}
input[type=checkbox]:checked ~ .hd-login-bt li a {
background: #BBB;
}
.menu_mega .menu_second-level {
position: relative;
top: inherit;
left: inherit;
box-sizing: border-box;
width: 100%;
padding: 0;
background: #222;
transition: all 0.2s ease;
visibility: visible;
opacity: 1;
z-index: 1;
}
.menu_mega:hover .menu_second-level {
top: inherit;
visibility: visible;
opacity: 1;
}
.menu_mega .menu_second-level > li {
display: block;
border: 0;
border-top: 1px dotted rgba(0, 0, 0, 0.6);
}
.menu_mega .menu_second-level > li:last-child {
border-bottom: none !important;
}
.menu_mega .menu_second-level > li:nth-child(3n+2) {
margin: 0;
}
.fixed {
position: fixed !important;
top: 0 !important;
left: 0 !important;
z-index: 1000 !important;
width: 100% !important;
}
@-webkit-keyframes example {
100% {
opacity: 1;
transform: translateX(0);
}
}
@keyframes example {
100% {
opacity: 1;
transform: translateX(0);
}
}
@media screen and (max-width: 1000px) {
.sidebarIconToggle {
width: 3rem;
height: 3rem;
padding: 1.15rem 0.8rem;
}
.spinner {
transition: all 0.3s;
box-sizing: border-box;
position: absolute;
height: 0.05rem;
border-radius: 0.2rem;
width: 100%;
background-color: #000;
}
.horizontal {
transition: all 0.3s;
box-sizing: border-box;
position: relative;
float: left;
margin-top: 0.4rem;
}
.diagonal.part-1 {
position: relative;
transition: all 0.3s;
box-sizing: border-box;
float: left;
background-color: #000;
}
.diagonal.part-2 {
transition: all 0.3s;
box-sizing: border-box;
position: relative;
float: left;
margin-top: 0.6rem;
background-color: #000;
}
input[type=checkbox]:checked ~ .sidebarIconToggle > .horizontal {
transition: all 0.3s;
box-sizing: border-box;
opacity: 0;
}
input[type=checkbox]:checked ~ .sidebarIconToggle > .diagonal.part-1 {
transition: all 0.3s;
box-sizing: border-box;
transform: rotate(135deg);
margin-top: 0.8rem;
background-color: #000;
}
input[type=checkbox]:checked ~ .sidebarIconToggle > .diagonal.part-2 {
transition: all 0.3s;
box-sizing: border-box;
transform: rotate(-135deg);
margin-top: -0.05rem;
background-color: #000;
}
input[type=checkbox]:checked ~ .sidebarIconToggle {
padding: 0.7rem 0.8rem 0.8rem 0.8rem;
}
input[type=checkbox]:checked ~ .hd-login-bt li a {
background: #BBB;
}
}
/* Footer
--------------------------------------------------------------------------*/
footer {
position: relative;
box-sizing: border-box;
margin: 0;
padding: 6rem 0 1.5rem 0;
background: #eaeae4;
overflow: hidden;
background: #efc138;
font-family: 'Noto Serif JP', '游明朝', 'Yu Mincho', YuMincho, 'Hiragino Mincho Pro', serif;
color: #000000;
z-index: 3;
}
footer .ft-wrap {
position: relative;
box-sizing: border-box;
width: 100%;
max-width: 100rem;
margin: auto;
}
footer .ft-wrap .ft-logo {
width: 100%;
max-width: 5rem;
margin: 0 auto 6rem auto;
}
footer .ft-wrap ul.ft-info {
position: relative;
display: flex;
justify-content: center;
width: 84%;
margin: 0 8% 6rem 8%;
}
footer .ft-wrap ul.ft-info li {
position: relative;
box-sizing: border-box;
width: 50%;
padding: 0 9%;
}
footer .ft-wrap ul.ft-info li:first-child {
border-right: 1px solid #b79123;
}
footer .ft-wrap ul.ft-info li picture {
display: block;
margin-bottom: 1.5rem;
}
footer .ft-wrap ul.ft-info li .ft-info-tx {
width: 90%;
margin: 0 5%;
}
footer .ft-wrap ul.ft-info li .ft-info-tx h4 {
font-size: 1.4rem;
font-weight: 600;
color: #000000;
}
footer .ft-wrap ul.ft-info li .ft-info-tx h4 span {
font-size: 0.9rem;
}
footer .ft-wrap ul.ft-info li .ft-info-tx h5 {
font-weight: 600;
color: #000000;
}
footer .ft-wrap ul.ft-info li .ft-info-tx p {
margin-bottom: 0.3rem;
color: #000000;
}
footer .ft-wrap ul.ft-info li .ft-info-tx div.ft-tel {
position: relative;
box-sizing: border-box;
width: 100%;
margin: 1rem 0;
}
footer .ft-wrap ul.ft-info li .ft-info-tx div.ft-tel a {
position: relative;
box-sizing: border-box;
width: 100%;
display: block;
color: #000;
padding: 0.5rem 1rem;
font-size: 1.2rem;
text-align: center;
border: 1px solid #b79123;
overflow: hidden;
}
footer .ft-wrap ul.ft-info li .ft-info-tx div.ft-tel a:before {
content: "";
position: absolute;
box-sizing: border-box;
display: block;
margin: auto;
width: 1.8rem;
height: 1.8rem;
top: 0.5rem;
left: 0.5rem;
background: url("../img/svg/icon-tel-ft.svg");
background-size: 100%;
background-position: center center;
background-repeat: no-repeat;
opacity: 1;
transition: all 0.5s;
z-index: 4;
}
footer .ft-wrap ul.ft-info li .ft-info-tx div.ft-map {
position: relative;
box-sizing: border-box;
width: 100%;
margin: 1rem 0;
}
footer .ft-wrap ul.ft-info li .ft-info-tx div.ft-map a {
position: relative;
box-sizing: border-box;
width: 100%;
display: block;
color: #000;
text-decoration: none;
padding: 0.5rem 1rem;
font-size: 1.2rem;
text-align: center;
border: 1px solid #b79123;
}
footer .ft-wrap ul.ft-info li .ft-info-tx div.ft-map a:before {
content: "";
position: absolute;
box-sizing: border-box;
display: block;
margin: auto;
width: 1.8rem;
height: 1.8rem;
top: 0.5rem;
left: 0.5rem;
background: url("../img/svg/icon-map-ft.svg");
background-size: 100%;
background-position: center center;
background-repeat: no-repeat;
opacity: 1;
transition: all 0.5s;
z-index: 4;
}
footer .ft-wrap .ft-copy {
position: relative;
box-sizing: border-box;
text-align: center;
}
footer .ft-wrap .ft-copy p {
font-size: 0.6rem;
color: #000;
}
@media screen and (max-width: 1300px) {
footer {
padding: 4rem 0 1.5rem 0;
}
footer .ft-wrap .ft-logo {
max-width: 4rem;
margin: 0 auto 4rem auto;
}
footer .ft-wrap ul.ft-info {
width: 100%;
margin: 0 0 4rem 0;
}
footer .ft-wrap ul.ft-info li {
position: relative;
box-sizing: border-box;
width: 50%;
padding: 0 7%;
}
footer .ft-wrap ul.ft-info li .ft-info-tx {
width: 90%;
margin: 0 5%;
}
footer .ft-wrap ul.ft-info li .ft-info-tx h4 span {
display: block;
}
}
@media screen and (max-width: 751px) {
footer {
padding: 6vw 0 4vw 0;
}
footer .ft-wrap .ft-logo {
width: 100%;
max-width: 10vw;
margin: 0 auto 6vw auto;
}
footer .ft-wrap ul.ft-info {
display: block;
width: 90%;
margin: 0 5% 3vw 5%;
}
footer .ft-wrap ul.ft-info li {
width: 100%;
padding: 0 9% 3vw 9%;
}
footer .ft-wrap ul.ft-info li:first-child {
border-right: none;
}
footer .ft-wrap ul.ft-info li picture {
margin-bottom: 4vw;
}
footer .ft-wrap ul.ft-info li .ft-info-tx {
width: 96%;
margin: 0 2%;
}
footer .ft-wrap ul.ft-info li .ft-info-tx h4 {
font-size: 4.6vw;
}
footer .ft-wrap ul.ft-info li .ft-info-tx h4 span {
font-size: 3vw;
display: inline-block;
}
footer .ft-wrap ul.ft-info li .ft-info-tx h5 {
font-size: 3.4vw;
margin-bottom: 1vw;
}
footer .ft-wrap ul.ft-info li .ft-info-tx p {
font-size: 3.6vw;
margin-bottom: 2vw;
}
footer .ft-wrap ul.ft-info li .ft-info-tx div.ft-tel {
margin: 3vw 0;
}
footer .ft-wrap ul.ft-info li .ft-info-tx div.ft-tel a {
display: block;
padding: 1.6vw 1vw 2vw 1vw;
font-size: 4.2vw;
text-decoration: none;
}
footer .ft-wrap ul.ft-info li .ft-info-tx div.ft-tel a:before {
width: 6.5vw;
height: 6.5vw;
top: 1.5vw;
left: 1.5vw;
}
footer .ft-wrap ul.ft-info li .ft-info-tx div.ft-map {
margin: 3vw 0;
}
footer .ft-wrap ul.ft-info li .ft-info-tx div.ft-map a {
display: block;
padding: 1.6vw 1vw 2vw 1vw;
font-size: 4.2vw;
text-decoration: none;
}
footer .ft-wrap ul.ft-info li .ft-info-tx div.ft-map a:before {
width: 6.5vw;
height: 6.5vw;
top: 1.5vw;
left: 1.5vw;
}
}
/* TOP-KEY-V
--------------------------------------------------------------------------*/
#top section.key-v {
position: relative;
box-sizing: border-box;
width: 100%;
padding: 0 0 0 3.4375rem;
display: block;
overflow: inherit;
}
#top section.key-v h2 {
position: absolute;
top: 5%;
left: 15%;
font-size: 1.1rem;
font-weight: normal;
writing-mode: vertical-rl;
letter-spacing: 0.1rem;
color: #FFF;
}
#top div.key-v-page {
position: relative;
box-sizing: border-box;
width: 100%;
padding: 0 0 3rem 3.4375rem;
display: block;
overflow: inherit;
}
body.ct-yukke div.bsed.body-tx div.key-v-page .key-v-tx {
position: absolute;
bottom: 12%;
right: 8%;
width: 92%;
text-align: right;
}
body.ct-yukke div.bsed.body-tx div.key-v-page .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 3.8rem !important;
font-weight: 600;
writing-mode: horizontal-tb;
letter-spacing: 0.1rem;
margin: 0 0 1rem 0 !important;
width: 100% !important;
color: #000;
}
body.ct-yukke div.bsed.body-tx div.key-v-page .key-v-tx h2 span {
margin-right: 1rem;
}
body.ct-yukke div.bsed.body-tx div.key-v-page .key-v-tx p {
font-size: 1.2rem;
letter-spacing: 0.08rem;
margin: 0 0 1rem 0 !important;
width: 100% !important;
}
body.ct-wagyu div.bsed.body-tx div.key-v-page .key-v-tx {
position: absolute;
bottom: 12%;
left: 14%;
}
body.ct-wagyu div.bsed.body-tx div.key-v-page .key-v-tx h2 {
font-size: 1.4rem !important;
font-weight: normal;
writing-mode: vertical-rl;
letter-spacing: 0.1rem;
color: #FFF !important;
}
body.ct-wagyu div.bsed.body-tx div.key-v-page .key-v-tx h2 span {
margin-right: 1rem;
}
body.ct-rice div.bsed.body-tx div.key-v-page .key-v-tx {
position: absolute;
bottom: 14%;
left: 6%;
width: 95%;
}
body.ct-rice div.bsed.body-tx div.key-v-page .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 3.5rem !important;
font-weight: 600;
writing-mode: horizontal-tb;
letter-spacing: 0.1rem;
margin: 0 0 1rem 0 !important;
width: 100% !important;
color: #000;
}
body.ct-rice div.bsed.body-tx div.key-v-page .key-v-tx h2 span {
font-size: 1.2rem !important;
margin-right: 1rem;
margin-bottom: 1rem;
display: block;
}
body.ct-kimchi div.bsed.body-tx div.key-v-page .key-v-tx {
position: absolute;
top: 0;
left: 53%;
}
body.ct-kimchi div.bsed.body-tx div.key-v-page .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 1.9rem !important;
font-weight: 600;
writing-mode: vertical-rl;
letter-spacing: 0.1rem;
margin-bottom: 1rem;
color: #FFF;
}
body.ct-kimchi div.bsed.body-tx div.key-v-page .key-v-tx h2 span {
font-size: 1rem !important;
margin-right: 1rem;
margin-bottom: 1rem;
display: block;
}
body.ct-matsumura div.bsed.body-tx div.key-v-page .key-v-tx {
position: absolute;
top: 3%;
right: 13%;
}
body.ct-matsumura div.bsed.body-tx div.key-v-page .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 1.5rem !important;
font-weight: 600;
writing-mode: vertical-rl;
letter-spacing: 0.1rem;
margin-bottom: 1rem;
color: #FFF;
}
body.ct-kubo div.bsed.body-tx div.key-v-page .key-v-tx {
position: absolute;
top: 2%;
left: 56%;
}
body.ct-kubo div.bsed.body-tx div.key-v-page .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 1.9rem !important;
font-weight: 600;
writing-mode: vertical-rl;
letter-spacing: 0.1rem;
margin-bottom: 1rem;
color: #FFF;
}
body.ct-kubo div.bsed.body-tx div.key-v-page .key-v-tx h2 span {
font-size: 1rem !important;
margin-right: 1rem;
margin-bottom: 1rem;
display: block;
}
body.ct-course div.bsed.body-tx div.key-v-page .key-v-tx {
position: absolute;
bottom: 5%;
left: 5%;
z-index: 2;
}
body.ct-course div.bsed.body-tx div.key-v-page .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
width: 100% !important;
font-size: 1.9rem !important;
font-weight: 600;
writing-mode: horizontal-tb;
letter-spacing: 0.1rem;
margin-bottom: 1rem;
color: #FFF;
}
body.ct-course div.bsed.body-tx div.key-v-page .key-v-tx h2 span {
font-size: 1rem !important;
margin-right: 1rem;
margin-bottom: 0 !important;
display: block;
}
body.ct-menu div.bsed.body-tx div.key-v-page .key-v-tx {
position: absolute;
bottom: 10%;
left: 1%;
width: 95%;
}
body.ct-menu div.bsed.body-tx div.key-v-page .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 2.4rem !important;
font-weight: 600;
letter-spacing: 0.1rem;
margin-bottom: 1rem;
color: #FFF;
}
body.ct-cmn div.bsed.body-tx div.key-v-page .key-v-tx {
position: absolute;
bottom: 16%;
left: 1%;
width: 95%;
}
body.ct-cmn div.bsed.body-tx div.key-v-page .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 2.4rem !important;
font-weight: 600;
letter-spacing: 0.1rem;
margin-bottom: 1rem;
color: #FFF;
}
body.ct-cmn header .hd-eng {
display: none;
}
article.ct-cmn div.key-v-page .key-v-tx {
position: absolute;
bottom: 16%;
left: 3.5%;
width: 95%;
}
article.ct-cmn div.key-v-page .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 2.4rem !important;
font-weight: 600;
letter-spacing: 0.1rem;
margin-bottom: 1rem;
color: #FFF;
}
#top.ct-wagyu section.key-v h2 {
position: absolute;
top: 5%;
rigt: 55%;
font-size: 1.4rem;
font-weight: normal;
writing-mode: vertical-rl;
letter-spacing: 0.1rem;
color: #FFF;
}
#page section.key-v {
position: relative;
box-sizing: border-box;
width: 100%;
padding: 0 0 0 3.4375rem;
height: 14rem;
display: block;
padding: 0;
background: #faf9f7;
overflow: inherit;
}
#page section.key-v h2 {
position: absolute;
bottom: 2rem;
left: 0;
right: 0;
margin: auto;
}
#top.ct-rice section.key-v .key-v-tx {
position: absolute;
bottom: 12%;
left: 5%;
width: 95%;
}
#top.ct-rice section.key-v .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 4.4rem;
font-weight: 600;
writing-mode: horizontal-tb;
letter-spacing: 0.1rem;
margin-bottom: 1rem;
color: #000;
}
#top.ct-rice section.key-v .key-v-tx h2 span {
font-size: 1.1rem;
margin-right: 1rem;
margin-bottom: 1rem;
display: block;
}
#top.ct-rice section.key-v .key-v-tx p {
font-size: 1.2rem;
letter-spacing: 0.08rem;
}
#top.ct-kimchi section.key-v .key-v-tx {
position: absolute;
top: 4%;
left: 50%;
}
#top.ct-kimchi section.key-v .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 2.4rem;
font-weight: 600;
writing-mode: vertical-rl;
letter-spacing: 0.1rem;
margin-bottom: 1rem;
color: #FFF;
}
#top.ct-kimchi section.key-v .key-v-tx h2 span {
font-size: 1.1rem;
margin-right: 1rem;
margin-bottom: 1rem;
display: block;
}
#top.ct-kimchi section.key-v .key-v-tx p {
font-size: 1.2rem;
letter-spacing: 0.08rem;
color: #FFF;
}
#top.ct-cpuse section.key-v .key-v-tx {
position: absolute;
bottom: 5%;
left: 5%;
z-index: 2;
}
#top.ct-cpuse section.key-v .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 2.8rem;
font-weight: 600;
writing-mode: horizontal-tb;
letter-spacing: 0.1rem;
margin-bottom: 1rem;
color: #FFF;
display: block;
}
#top.ct-cpuse section.key-v .key-v-tx h2 span {
font-size: 1.1rem;
margin-left: 1rem;
margin-bottom: 1rem;
display: block;
}
#top.ct-contact section.key-v .key-v-tx {
position: absolute;
bottom: 5%;
left: 4%;
width: 96%;
}
#top.ct-contact section.key-v .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 2.4rem;
font-weight: 600;
writing-mode: horizontal-tb;
letter-spacing: 0.1rem;
margin-bottom: 1rem;
color: #FFF;
}
#top.ct-contact section.key-v .key-v-tx h2 span {
font-size: 1.1rem;
margin-right: 1rem;
margin-bottom: 1rem;
display: block;
}
#top.ct-contact section.key-v .key-v-tx p {
font-size: 1.2rem;
letter-spacing: 0.08rem;
color: #FFF;
}
#top.ct-matsumura section.key-v .key-v-tx {
position: absolute;
top: 4%;
left: 8%;
}
#top.ct-matsumura section.key-v .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 1.6rem;
font-weight: 600;
writing-mode: vertical-rl;
letter-spacing: 0.1rem;
margin-bottom: 1rem;
color: #FFF;
}
#top.ct-matsumura section.key-v .key-v-tx h2 span {
font-size: 1.1rem;
margin-right: 1rem;
margin-bottom: 1rem;
display: block;
}
#top.ct-matsumura section.key-v .key-v-tx p {
font-size: 1.2rem;
letter-spacing: 0.08rem;
color: #FFF;
}
#top.ct-kubo section.key-v .key-v-tx {
position: absolute;
top: 7%;
left: 50%;
}
#top.ct-kubo section.key-v .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 2.4rem;
font-weight: 600;
writing-mode: vertical-rl;
letter-spacing: 0.1rem;
margin-bottom: 1rem;
color: #FFF;
}
#top.ct-kubo section.key-v .key-v-tx h2 span {
font-size: 1.1rem;
margin-left: 1rem;
margin-bottom: 1rem;
display: block;
}
#top.ct-kubo section.key-v .key-v-tx p {
font-size: 1.2rem;
letter-spacing: 0.08rem;
color: #FFF;
}
#top.ct-menu section.key-v .key-v-tx {
position: absolute;
bottom: 5%;
left: 4%;
width: 96%;
}
#top.ct-menu section.key-v .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 2.4rem;
font-weight: 600;
writing-mode: horizontal-tb;
letter-spacing: 0.1rem;
margin-bottom: 1rem;
color: #FFF;
}
#top.ct-menu section.key-v .key-v-tx h2 span {
font-size: 1.1rem;
margin-right: 1rem;
margin-bottom: 1rem;
display: block;
}
#top.ct-menu section.key-v .key-v-tx p {
font-size: 1.2rem;
letter-spacing: 0.08rem;
color: #FFF;
}
#top.ct-menu section dl {
display: flex;
padding-bottom: 1rem;
}
#top.ct-menu section dl dt {
font-size: 1.3rem;
font-weight: 600;
width: 70%;
}
#top.ct-menu section dl dt span {
font-size: 0.95rem;
display: block;
}
#top.ct-menu section dl dd {
font-size: 1.3rem;
text-align: right;
width: 30%;
}
@media screen and (max-width: 1000px) {
#top section.key-v {
padding: 0 0 0 3rem;
}
#top section.key-v h2 {
top: 5%;
left: 15%;
font-size: 1.8vw;
line-height: 3vw;
font-weight: normal;
letter-spacing: 0.1vw;
}
#page section.key-v {
height: 10rem;
}
#page section.key-v h2 {
font-size: 1.6rem;
}
#top div.key-v-page {
padding: 0 0 3rem 3rem;
}
}
@media screen and (max-width: 751px) {
#top section.key-v {
padding: 0 0 0 3rem;
}
#top section.key-v h2 {
top: 5%;
left: 15%;
font-size: 2.3vw;
line-height: 4vw;
font-weight: normal;
letter-spacing: 0.1vw;
}
#top div.key-v-page {
padding: 0 0 5vw 3rem;
}
body.ct-yukke div.bsed.body-tx div.key-v-page .key-v-tx {
bottom: 8%;
right: 6%;
width: 94%;
}
body.ct-yukke div.bsed.body-tx div.key-v-page .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 9vw !important;
font-weight: 600;
writing-mode: horizontal-tb;
letter-spacing: 0.1rem;
margin: 0 0 2vw 0 !important;
width: 100% !important;
color: #000;
}
body.ct-yukke div.bsed.body-tx div.key-v-page .key-v-tx h2 span {
font-size: 5vw !important;
margin-right: 1rem;
}
body.ct-yukke div.bsed.body-tx div.key-v-page .key-v-tx p {
font-size: 3vw !important;
margin: 0 0 2vw 0 !important;
}
body.ct-wagyu div.bsed.body-tx div.key-v-page .key-v-tx {
position: absolute;
bottom: auto;
top: 3vw;
left: 70%;
}
body.ct-wagyu div.bsed.body-tx div.key-v-page .key-v-tx h2 {
font-size: 3vw !important;
font-weight: normal;
writing-mode: vertical-rl;
letter-spacing: 0.1rem;
color: #FFF !important;
}
body.ct-rice div.bsed.body-tx div.key-v-page .key-v-tx {
position: absolute;
bottom: 10%;
left: 10%;
width: 90%;
}
body.ct-rice div.bsed.body-tx div.key-v-page .key-v-tx h2 {
font-size: 8vw !important;
letter-spacing: 0.1rem;
margin: 0 0 3vw 0 !important;
}
body.ct-rice div.bsed.body-tx div.key-v-page .key-v-tx h2 span {
font-size: 4vw !important;
margin-bottom: 2vw;
}
body.ct-kimchi div.bsed.body-tx div.key-v-page .key-v-tx {
position: absolute;
top: 0;
left: 56%;
}
body.ct-kimchi div.bsed.body-tx div.key-v-page .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 5vw !important;
font-weight: 600;
writing-mode: vertical-rl;
letter-spacing: 0.1rem;
margin-bottom: 1rem;
color: #FFF;
}
body.ct-kimchi div.bsed.body-tx div.key-v-page .key-v-tx h2 span {
font-size: 3.5vw !important;
margin-right: 1rem;
margin-bottom: 1rem;
display: block;
}
body.ct-matsumura div.bsed.body-tx div.key-v-page .key-v-tx {
top: 0%;
right: 40%;
}
body.ct-matsumura div.bsed.body-tx div.key-v-page .key-v-tx h2 {
font-size: 4vw !important;
}
body.ct-kubo div.bsed.body-tx div.key-v-page .key-v-tx {
position: absolute;
top: 0;
left: 66%;
}
body.ct-kubo div.bsed.body-tx div.key-v-page .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 5vw !important;
font-weight: 600;
writing-mode: vertical-rl;
letter-spacing: 0.1rem;
margin-bottom: 1rem;
color: #FFF;
}
body.ct-kubo div.bsed.body-tx div.key-v-page .key-v-tx h2 span {
font-size: 3.5vw !important;
margin-right: 1rem;
margin-bottom: 1rem;
display: block;
}
body.ct-course div.bsed.body-tx div.key-v-page .key-v-tx {
position: absolute;
bottom: 5%;
left: 12%;
}
body.ct-course div.bsed.body-tx div.key-v-page .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 6vw !important;
font-weight: 600;
letter-spacing: 0.1rem;
margin-bottom: 1rem;
color: #FFF;
}
body.ct-course div.bsed.body-tx div.key-v-page .key-v-tx h2 span {
font-size: 3vw !important;
margin-right: 1rem;
margin-bottom: 1rem;
display: block;
}
body.ct-cmn div.bsed.body-tx div.key-v-page .key-v-tx {
position: absolute;
bottom: 16%;
left: 4%;
width: 95%;
}
body.ct-cmn div.bsed.body-tx div.key-v-page .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 4vw !important;
font-weight: 600;
letter-spacing: 0.1rem;
margin-bottom: 1rem;
color: #FFF;
}
article.ct-cmn div.key-v-page .key-v-tx {
position: absolute;
bottom: 16%;
left: 8%;
width: 95%;
}
article.ct-cmn div.key-v-page .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 4vw !important;
font-weight: 600;
letter-spacing: 0.1rem;
margin-bottom: 0;
color: #FFF;
}
body.ct-menu div.bsed.body-tx div.key-v-page .key-v-tx {
position: absolute;
bottom: 10%;
left: 10%;
width: 90%;
}
body.ct-menu div.bsed.body-tx div.key-v-page .key-v-tx h2 {
position: relative;
top: inherit;
left: inherit;
font-size: 2.4rem !important;
font-weight: 600;
letter-spacing: 0.1rem;
margin: 0 !important;
color: #FFF;
}
}
/* Interview
--------------------------------------------------------------------------*/
.interview-menu ul {
position: relative;
box-sizing: border-box;
width: 100%;
display: flex;
flex-wrap: wrap;
}
.interview-menu ul li {
width: 49%;
margin-right: 2%;
margin-bottom: 2%;
}
.interview-menu ul li a {
display: block;
opacity: 1;
transition: all 0.5s;
}
.interview-menu ul li a:hover {
opacity: 0.8;
}
.interview-menu ul li:nth-child(2n) {
margin-right: 0;
}
.itv-name {
position: relative;
box-sizing: border-box;
width: 100%;
display: block;
overflow: hidden;
padding: 8% 10%;
background: #ffd9ae;
}
.itv-name h6 {
font-size: 1.34rem;
margin-bottom: 0.8rem;
}
@media screen and (max-width: 751px) {
.interview-menu ul {
position: relative;
box-sizing: border-box;
width: 100%;
display: block;
}
.interview-menu ul li {
width: 100%;
margin-right: 0;
margin-bottom: 2%;
}
.interview-menu ul li a {
display: block;
opacity: 1;
transition: all 0.5s;
}
.interview-menu ul li a:hover {
opacity: 0.8;
}
.interview-menu ul li:nth-child(2n) {
margin-right: 0;
}
}
/* News
--------------------------------------------------------------------------*/
#news {
position: relative;
box-sizing: border-box;
background: #fbfaf6;
width: 90%;
margin: 0 5% 0 5%;
padding: 4% 5% 5% 5%;
}
#news .new-box {
display: flex;
}
#news .new-box h3 {
position: relative;
box-sizing: border-box;
width: 15%;
padding: 0.8rem 0 0 0;
}
#news .new-box .info-n {
position: relative;
box-sizing: border-box;
display: block;
width: 80%;
margin: 0 auto 0 5%;
overflow: hidden;
}
#news .bt-type1n {
position: absolute;
width: 16%;
bottom: 0;
right: 0;
}
.info-n ol.info-ls dl {
position: relative;
width: 100%;
display: block;
margin-bottom: 0.5rem;
}
.info-n ol.info-ls dt {
position: relative;
width: 100%;
margin: 0;
padding: 0.8rem 0 0 0;
letter-spacing: 0.05rem;
}
.info-n ol.info-ls dd {
position: relative;
width: 100%;
margin: 0;
padding: 0 0 0.8rem 0;
letter-spacing: 0.05rem;
border-bottom: dotted 1px #AAA;
}
.info-n ol.info-ls dd a {
color: #003F94;
text-decoration: none;
transition: all 0.4s;
}
.info-n ol.info-ls dd a:hover {
color: #0E3287;
}
h3.page-title {
position: relative;
box-sizing: border-box;
width: 100%;
min-height: 300px;
margin: 0 0 3rem 0;
padding: 140px 5rem 3rem 5rem;
text-align: center;
background: #001c61;
color: #FFFFFF;
}
.page-date {
text-align: right;
margin-bottom: 2rem;
}
@media screen and (max-width: 1100px) {
#news {
position: relative;
box-sizing: border-box;
background: #fbfaf6;
width: 90%;
margin: 0 5% 0 5%;
padding: 5.5vw 8%;
}
#news .new-box {
display: block;
}
#news .new-box h3 {
width: 100%;
padding: 0;
}
#news .new-box .info-n {
position: relative;
box-sizing: border-box;
display: block;
bottom: auto;
left: auto;
right: auto;
width: 100%;
margin: 0 auto 0 auto;
overflow: hidden;
}
#news .bt-type1n {
position: relative;
width: 50%;
bottom: auto;
right: auto;
margin: 5vw 25% 0 25%;
}
.info-n ol.info-ls dt {
font-size: 0.85rem !important;
padding: 1vw 0 0 0;
}
.info-n ol.info-ls dd {
font-size: 0.9rem !important;
padding: 0 0 1vw 0;
}
}
@media screen and (max-width: 751px) {
#news {
position: relative;
box-sizing: border-box;
background: #fbfaf6;
width: 90%;
margin: 0 5% 0 5%;
padding: 5.5vw 8%;
}
#news .new-box {
display: block;
}
#news .new-box h3 {
width: 100%;
padding: 0;
}
#news .new-box .info-n {
position: relative;
box-sizing: border-box;
display: block;
width: 100%;
margin: 0 auto 0 auto;
overflow: hidden;
}
#news .bt-type1n {
position: relative;
width: 60%;
bottom: auto;
right: auto;
margin: 5vw 20% 0 20%;
font-size: 3.2vw;
}
.info-n ol.info-ls dt {
font-size: 0.85rem !important;
padding: 1vw 0 0 0;
}
.info-n ol.info-ls dd {
font-size: 0.9rem !important;
padding: 0 0 1vw 0;
}
}
/* Link-Button
--------------------------------------------------------------------------*/
a {
color: #0076c9;
text-decoration: underline;
}
a:hover {
color: #ff6000;
}
.bt-base {
box-sizing: border-box;
text-align: center;
text-decoration: none;
margin: auto;
overflow: hidden;
transition: background-color 0.5s ease 0s;
}
.bt-base:hover {
background: rgba(255, 255, 255, 0.4);
}
.bt-type1t a {
box-sizing: border-box;
text-align: center;
text-decoration: none;
margin: auto;
overflow: hidden;
transition: background-color 0.5s ease 0s;
position: relative;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
padding: 0.6rem 1.8rem;
border: solid 1px #d5dce0;
color: #111211;
}
.bt-type1t a:hover {
background: rgba(255, 255, 255, 0.4);
}
.bt-type1t a:after {
position: absolute;
display: block;
content: url("../img/svg/icon-allow2.svg");
width: 0.6rem;
height: 0.6rem;
right: 1rem;
line-height: 0.5rem;
}
.bt-type2t a {
box-sizing: border-box;
text-align: center;
text-decoration: none;
margin: auto;
overflow: hidden;
transition: background-color 0.5s ease 0s;
position: relative;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
padding: 0.6rem 1.8rem;
border: solid 1px #FFF;
color: #FFF !important;
}
.bt-type2t a:hover {
background: rgba(255, 255, 255, 0.4);
}
.bt-type2t a:after {
position: absolute;
display: block;
content: url("../img/svg/icon-allow2.svg");
fill: #42AFE3;
width: 0.6rem;
height: 0.6rem;
right: 1rem;
line-height: 0.5rem;
}
.bt-type1n a {
box-sizing: border-box;
text-align: center;
text-decoration: none;
margin: auto;
overflow: hidden;
transition: background-color 0.5s ease 0s;
position: relative;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
padding: 0.6rem 1.8rem;
background: #e7e4da;
color: #232323;
}
.bt-type1n a:hover {
background: rgba(255, 255, 255, 0.4);
}
.bt-type1n a:after {
position: absolute;
display: block;
content: url("../img/svg/icon-allow2.svg");
width: 0.6rem;
height: 0.6rem;
right: 1rem;
line-height: 0.5rem;
}
.bt-type1 a {
box-sizing: border-box;
text-align: center;
text-decoration: none;
margin: auto;
overflow: hidden;
transition: background-color 0.5s ease 0s;
position: relative;
width: 60%;
max-width: 25rem;
display: flex;
align-items: center;
justify-content: center;
padding: 0.8rem 1.8rem;
border: solid 1px #d7d2c6;
color: #111211;
}
.bt-type1 a:hover {
background: rgba(255, 255, 255, 0.4);
}
.bt-type1 a:after {
position: absolute;
display: block;
content: url("../img/svg/icon-allow1.svg");
width: 1rem;
height: 1rem;
right: 1rem;
line-height: 1rem;
}
.bt-type1s a {
box-sizing: border-box;
text-align: center;
text-decoration: none;
margin: auto;
overflow: hidden;
transition: background-color 0.5s ease 0s;
position: relative;
width: 30%;
margin: 0 auto 0.8rem auto;
display: flex;
align-items: center;
justify-content: center;
padding: 0.2rem 1.6rem 0.4rem 1.6rem;
border: solid 1px #d7d2c6;
color: #111211;
font-size: 0.9rem;
}
.bt-type1s a:hover {
background: rgba(255, 255, 255, 0.4);
}
.bt-type1s a:hover {
background-color: #F0EFE5;
}
.bt-type1s a:after {
position: absolute;
display: block;
content: url("../img/svg/icon-allow1.svg");
width: 1rem;
height: 1rem;
right: 0.6rem;
line-height: 1.3rem;
}
.bt-type2 a {
box-sizing: border-box;
text-align: center;
text-decoration: none;
margin: auto;
overflow: hidden;
transition: background-color 0.5s ease 0s;
position: absolute;
bottom: 0;
right: 0;
width: 100%;
max-width: 20rem;
display: flex;
align-items: center;
justify-content: center;
background: #FFF;
padding: 0.6rem 1.8rem;
color: #111211;
}
.bt-type2 a:hover {
background: rgba(255, 255, 255, 0.4);
}
.bt-type2 a:hover {
background-color: #F0EFE5;
}
.bt-type2 a:after {
position: absolute;
display: block;
content: url("../img/svg/icon-allow1.svg");
width: 1rem;
height: 1rem;
right: 1rem;
line-height: 1rem;
}
.bt-close a {
position: fixed;
bottom: 1rem;
left: 0;
right: 0;
margin: 0 auto 0 auto;
z-index: 500;
box-sizing: border-box;
display: block;
color: #fbed21;
background: url("../img/svg/icon-close-y.svg") #3f4b70;
background-size: 1rem 1rem;
background-position: 95% center;
background-repeat: no-repeat;
width: 100%;
max-width: 25rem;
margin: auto;
padding: 0.8rem 2rem 0.7rem 2rem;
border-radius: 1rem;
font-size: 1.1rem;
font-weight: 900;
text-align: center;
text-decoration: none;
transition: all 0.5s;
}
.bt-close a:hover {
background-color: #1d253c;
}
@media screen and (max-width: 751px) {
.bt-type1 a {
width: 80%;
padding: 0.5rem 1.8rem 0.7rem 1.8rem;
font-size: 0.95rem;
}
.bt-type1s a {
width: 70%;
padding: 0.2rem 1.6rem;
}
.bt-type1s a:after {
right: 1rem;
line-height: 1rem;
}
.bt-type2 a {
bottom: -0.2rem;
}
.bt-close a {
display: block;
bottom: calc(env(safe-area-inset-bottom));
color: #fbed21;
background: url("../img/svg/icon-close-y.svg") #3f4b70;
background-size: 1rem 1rem;
background-position: 96% center;
background-repeat: no-repeat;
width: 100%;
max-width: none;
margin: auto;
padding: 0.8rem 2rem 0.7rem 2rem;
border-radius: 0;
font-size: 1.1rem;
}
.bt-close a:hover {
background-color: #3f4b70;
}
}
/* LIST
--------------------------------------------------------------------------*/
ul.list-dot {
position: relative;
box-sizing: border-box;
width: 100%;
margin: 0 0 1rem 0;
}
ul.list-dot li {
position: relative;
box-sizing: border-box;
padding: 0 0.3rem 0 1.2rem;
margin-bottom: 0 !important;
}
ul.list-dot li:before {
content: '●';
position: absolute;
color: #385588;
left: 0;
top: 0;
display: inline-block;
}
ul.list-num {
position: relative;
box-sizing: border-box;
width: 100%;
margin: 0 0.4rem 1.8rem 0.4rem;
counter-reset: number 0;
}
ul.list-num li {
position: relative;
box-sizing: border-box;
padding: 0 0.3rem 0 1.2rem;
line-height: 2rem;
}
ul.list-num li:before {
position: absolute;
color: #d0bea2;
left: 0;
top: 0;
display: inline-block;
font-family: 'Roboto Condensed', sans-serif;
font-weight: 700;
counter-increment: number 1;
content: counter(number);
}
@media screen and (max-width: 751px) {
ul.list-dot li,
ul.list-num li {
line-height: 1.5rem;
}
}
@media screen and (max-width: 440px) {
ul.list-dot li,
ul.list-num li {
line-height: 1.4rem;
}
}
/* FAQ
--------------------------------------------------------------------------*/
.faq-box {
position: relative;
box-sizing: border-box;
border-radius: 0.5rem;
background: #f6f4f0;
padding: 1.4rem 2rem 0rem 2rem;
}
.faq-box h5 {
position: relative;
box-sizing: border-box;
padding: 0 0.3rem 1rem 1.8rem !important;
margin-bottom: 1rem;
line-height: 2rem;
border-bottom: 1px dotted #CCC;
}
.faq-box h5:before {
content: 'Q';
position: absolute;
color: #B54B22;
left: 0;
top: 0;
display: inline-block;
font-family: 'Roboto Condensed', sans-serif;
font-weight: 700;
font-size: 1.6rem;
}
.faq-box p {
position: relative;
box-sizing: border-box;
padding: 0 0.3rem 0 1.8rem !important;
line-height: 2rem;
}
.faq-box p:before {
content: 'A';
position: absolute;
color: #399215;
left: 0;
top: 0;
display: inline-block;
font-family: 'Roboto Condensed', sans-serif;
font-weight: 700;
font-size: 1.6rem;
}
.color-red {
color: #C00003;
}
/* TAB
---------------------------------------------------------------*/
.cntw-tab_wrap {
position: relative;
box-sizing: border-box;
width: 100%;
}
.cntw-tab_area {
position: relative;
box-sizing: border-box;
padding-top: 1.3rem;
text-align: center;
display: flex;
flex-wrap: wrap;
justify-content: center;
z-index: 5;
}
.cntw-tab_area ul {
position: relative;
box-sizing: border-box;
width: 100%;
display: flex;
flex-wrap: wrap;
}
.cntw-tab_area ul li {
position: relative;
box-sizing: border-box;
width: 50%;
display: flex;
justify-content: center;
align-items: flex-end;
}
.cntw-tab_area ul a:hover {
opacity: 0.9;
}
.cntw-tab_area ul li.tab1 a {
position: relative;
box-sizing: border-box;
width: 100%;
display: block;
padding: 0.7rem 2rem;
text-decoration: none;
font-weight: 900;
background: #ffb45e;
border-radius: 0.5rem 0.5rem 0 0;
color: #3f4b70;
transition: ease 0.2s opacity;
}
.cntw-tab_area ul li.tab2 a {
position: relative;
box-sizing: border-box;
width: 100%;
display: block;
padding: 0.7rem 2rem;
text-decoration: none;
font-weight: 900;
background: #3f4b70;
border-radius: 0.5rem 0.5rem 0 0;
color: #ffb45e;
transition: ease 0.2s opacity;
}
.cntw-panel_area {
position: relative;
box-sizing: border-box;
overflow: hidden;
width: 100%;
max-width: 75rem;
margin: auto;
}
.tab1-box {
border-top: solid 0.4rem #ffb45e;
}
.tab2-box {
border-top: solid 0.4rem #3f4b70;
}
@media screen and (max-width: 751px) {
.cntw-tab_area ul a:hover {
opacity: 0.9;
}
.cntw-tab_area ul li.tab1 a {
font-size: 0.8rem;
line-height: 1.2rem;
padding: 0.7rem 1rem;
}
.cntw-tab_area ul li.tab2 a {
font-size: 0.8rem;
line-height: 1.2rem;
padding: 0.7rem 1rem;
}
}
/* LAYOUT
--------------------------------------------------------------------------*/
.ctw8 {
width: 78% !important;
}
.ctw7 {
width: 68% !important;
}
.ctw6 {
width: 58% !important;
}
.ctw5 {
width: 48% !important;
}
.ctw4 {
width: 38% !important;
}
.ctw3l {
width: 31.333333% !important;
margin-right: 3%;
}
.ctw3r {
width: 31.333333% !important;
}
.ctw3 {
width: 28% !important;
}
.ctw2 {
width: 18% !important;
}
@media screen and (max-width: 751px) {
.cnt-l {
float: none !important;
}
.cnt-r {
float: none !important;
}
.ctw8 {
width: 100% !important;
}
.ctw7 {
width: 100% !important;
}
.ctw6 {
width: 100% !important;
}
.ctw5 {
width: 100% !important;
}
.ctw4 {
width: 100% !important;
}
.ctw3l {
width: 100% !important;
margin-right: 0%;
}
.ctw3r {
width: 100% !important;
}
.ctw3 {
width: 100% !important;
}
.ctw2 {
width: 100% !important;
}
}
/* PageTop
--------------------------------------------------------------------------*/
#page_top {
width: 2rem;
height: 2rem;
position: fixed;
right: 0.5rem;
bottom: 0.5rem;
opacity: 1;
z-index: 500;
}
#page_top a {
position: absolute;
bottom: 0;
display: block;
width: 2rem;
height: 2rem;
background: url("../img/svg/icon-ptop.svg") #eaeae4;
background-repeat: no-repeat;
background-size: 50%;
background-position: center center;
text-decoration: none;
border: 1px solid #FFFFFF;
}
/* TEL
--------------------------------------------------------------------------*/
@media (min-width: 751px) {
a[href*="tel:"] {
pointer-events: none;
cursor: default;
text-decoration: none;
}
}
/* NEWS LIST
--------------------------------------------------------------------------*/
button,
input,
select,
textarea {
margin: 0;
font-size: 100%;
vertical-align: middle;
}
button,
input {
*overflow: visible;
line-height: normal;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
padding: 0;
border: 0;
}
button,
input[type=button],
input[type=reset],
input[type=submit] {
cursor: pointer;
-webkit-appearance: button;
}
input[type=search] {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
-webkit-appearance: textfield;
}
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
-webkit-appearance: none;
}
textarea {
overflow: auto;
vertical-align: top;
}
.news-list {
overflow: hidden;
}
.news-list dt {
margin-bottom: 0 !important;
}
.news-list li {
border-bottom: 1px dotted #979797;
padding: 1rem 0;
}
.news-list li a {
text-decoration: none;
}
#page .news-list > li > .news-list-item {
border-style: solid none none;
border-radius: 0;
}
#page .news-list > :first-child > .news-list-item {
border: none;
}
#page .news-list-empty {
padding: 1.25rem 1rem;
font-size: 87.5%;
color: grey;
}
#page .news-list-item {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 0.75rem 1rem;
border: 1px solid #e1e1e1;
border-radius: 0.5rem;
text-decoration: none;
background: #fff;
}
#page .news-list-item .title {
width: 100%;
line-height: 1.25;
color: #333;
}
#page .news-list-item .date {
flex: 1;
padding-top: 0.25em;
text-align: right;
font-size: 75%;
color: #666;
}
.video-box {
margin: 2em auto;
text-align: center;
position: relative;
}
.heading + .video-box,
.subhead + .video-box,
.video-box:first-child {
margin-top: 0;
}
.video-box:last-child {
margin-bottom: 0;
}
.video-box:after {
content: "";
display: block;
padding-bottom: 56.25%;
}
.video-box iframe,
.video-box video {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
.map-box {
margin: 2em auto;
text-align: center;
}
.heading + .map-box,
.map-box:first-child,
.subhead + .map-box {
margin-top: 0;
}
.map-box:last-child {
margin-bottom: 0;
}
.map-box > .bs-replace-map {
min-height: 320px;
}
.map-box iframe {
max-width: 100%;
}
.table {
width: 100%;
margin: 1rem 0;
border-collapse: collapse;
}
.table td,
.table th {
padding: 0.5em 0.75em;
line-height: 1.333;
background: #fff;
border: solid 1px #C1BFB9;
}
.table td p,
.table th p {
margin-bottom: 0!important;
}
.table th {
font-weight: 400;
text-align: center;
background: #eaecef;
}
.table th p {
margin-bottom: 0 !important;
}
.table thead th {
vertical-align: middle;
background: #DEE6EB;
}
.table ol,
.table p,
.table ul {
margin: 0;
}
.btn {
display: inline-block;
padding: 0.75em 1em;
line-height: 1.2;
font-weight: 600;
border: 1px solid;
border-radius: 2em;
text-decoration: none;
}
a.btn {
display: inline-block;
padding: 0.75em 1em;
line-height: 1.2;
font-weight: 600;
border: 1px solid;
border-radius: 2em;
text-decoration: none;
color: #FFFFFF;
transition: all 0.5s;
}
a.btn:hover {
color: #FFFFFF !important;
background: #B88B06;
}
.btn.disabled,
.btn:disabled {
cursor: default;
opacity: 0.6;
color: #ddd;
}
.btn-sm {
font-size: 80%;
}
.btn-default {
color: #fff;
background: #e6961f;
border-color: #e6961f;
}
.btn-primary {
background: #0496c6;
border-color: #0496c6;
}
.btn-notice,
.btn-primary {
font-weight: 700;
color: #fff;
}
.btn-notice {
background: #e39500;
}
.btn-trp-w {
font-weight: 700;
color: #fff;
background: transparent;
border-color: #fff;
}
.form {
margin: 0 auto;
max-width: 45rem;
}
.form-control {
display: block;
width: 100%;
padding: 0.375em 0.5em;
font-family: inherit;
font-size: 100%;
font-weight: 400;
line-height: 1.4;
text-align: left;
text-decoration: none;
background: #fff;
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
border-radius: 0.25em;
color: #333;
border: 1px solid rgba(0, 0, 0, 0.2);
}
.form-control.block {
width: 100%;
}
.page404 {
position: relative;
box-sizing: border-box;
margin: 0 0 3rem 3.4375rem;
padding: 0 8%;
text-align: center;
}
.page404 h2 {
font-size: 1.8rem;
margin-bottom: 2rem;
}
.page404 p {
margin-bottom: 1.4rem;
}
.page404 .gsc-control-cse {
max-width: 40rem;
margin: auto;
}
@media (max-width: 751px) {
.page404 {
position: relative;
box-sizing: border-box;
margin: 0 0 0 3rem;
padding: 18vw 8% 18vw 8%;
text-align: left;
}
.page404 h2 {
font-size: 1.6rem;
margin-bottom: 2rem;
text-align: center;
}
.page404 p {
margin-bottom: 1.4rem;
}
.page404 .gsc-control-cse {
max-width: 40rem;
margin: auto;
}
}
@media (max-width: 440px) {
.page404 {
padding: 5vw 8% 5vw 8%;
}
.page404 h2 {
font-size: 1.3rem;
margin-bottom: 1.6rem;
text-align: center;
}
.page404 p {
margin-bottom: 1.2rem;
}
}
.form-control.has-error {
border-color: #ec534e;
}
.form-inline .form-control {
display: inline-block;
width: 12em;
}
.checkbox > label,
.radio > label {
display: inline-block;
padding: 0.25em 0;
cursor: pointer;
}
.checkbox > label > span,
.radio > label > span {
display: inline-block;
vertical-align: top;
margin-left: 0.15em;
}
.input-error {
display: block;
font-weight: 700;
color: #ea403b;
}
.form-sec {
margin: 0 0 3em;
padding: 1.5rem 2rem 0rem 2rem;
background: #f8f8f8;
}
.form-sec > .hd,
.form-sec > .hd-group {
padding: 0 0 0.5em;
font-size: 120%;
line-height: 1.2;
border-bottom: 1px solid #ddd;
}
.form-sec > .hd-group {
font-size: 100%;
}
.form-sec > .hd-group > .hd {
float: left;
font-size: 120%;
}
.form-sec > .hd-group > .btn {
float: right;
margin-top: -0.3125rem;
font-size: 87.5%;
color: #666;
}
.form-item {
margin: 1em 0;
}
.form-item > dt {
padding: 0 0 0.25em;
font-size: 92.5%;
font-weight: 700;
}
.form-item .form-control {
width: 100%;
}
.form-item-confirm {
font-size: 108%;
}
.form-item-confirm > dt {
font-size: 85.65%;
}
.form-item-autowidth .form-control {
width: auto;
min-width: 150px;
}
.form-action {
margin: 1.875rem auto 0;
max-width: 22.5rem;
}
.form-action .btn {
display: block;
width: 100%;
margin: 1.25rem 0;
}
.form-action-sub {
margin: 1.875rem 0;
font-size: 82.5%;
text-align: center;
}
.form-help {
display: block;
margin: 0.3125rem 0;
color: #666;
}
.pagination {
margin: 2rem 0;
text-align: center;
font-size: 0;
}
.pagination .sr-only {
display: none;
}
.pagination > li {
display: inline-block;
vertical-align: middle;
font-size: 16px;
}
.pagination > li + li > * {
margin-left: 3px;
}
.pagination > li > * {
box-sizing: content-box;
display: block;
position: relative;
padding: 8px;
min-width: 1em;
line-height: 16px;
text-align: center;
text-decoration: none;
color: #5c5c5c;
background: #fff;
border: 1px solid #e1e1e1;
border-radius: 3px;
cursor: default;
}
.pagination > li > a {
cursor: pointer;
}
.pagination > li > a:focus,
.pagination > li > a:hover {
border-color: #c3c3c3;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
text-decoration: none;
}
.pagination > li > a:active {
border-color: #c3c3c3;
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1), inset 0 2px 5px 0 rgba(0, 0, 0, 0.1);
}
.pagination > .active > * {
color: #fff;
background: #0496c6;
border-color: #0496c6;
box-shadow: none;
}
.pagination > .disabled > * {
box-shadow: none;
opacity: 0.5;
}
.pagination > .dots > * {
padding: 8px 1px;
border: none;
background: transparent;
opacity: 0.5;
}
.pagination > .next > *,
.pagination > .prev > * {
padding-top: 8px;
padding-bottom: 8px;
font-size: 14px;
}
.page-error {
max-width: 760px;
margin: 0 auto;
}
.entry-header .title {
margin-bottom: 0.5em;
}
.entry-header .title a {
color: #333;
text-decoration: underline;
}
.entry-header .title:after {
content: ">";
display: inline-block;
margin-left: 0.25em;
}
.entry-header .heading {
margin-top: 0;
}
.entry-form-sec {
margin: 2rem 0 0;
border: none;
}
.entry-form-sec > .sep-hd {
margin-bottom: 0.5rem;
}
.entry-form-label {
display: block;
padding: 0.5em;
font-size: 87.5%;
font-weight: 700;
background: #f8f8f8;
}
.entry-form-controls .checkbox,
.entry-form-controls .radio {
width: 100%;
}
.entry-form-input {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.entry-form-input .other-input {
margin-top: 5px;
}
.entry-form-required {
display: inline-block;
padding: 0.25em 0.333em;
font-size: 87.5%;
line-height: 1;
color: #fff;
background: #f85d52;
border-radius: 0.33em;
}
.entry-form-description {
margin-bottom: 0.5em;
font-size: 82.5%;
line-height: 1.2;
opacity: 0.7;
}
.entry-form-values {
margin-top: 0.35em;
list-style: none;
}
.entry-form-values > li {
display: inline-block;
}
.entry-form-values > li ~ li:before {
content: "、";
display: inline-block;
}
.entry-form-policy {
max-width: 34em;
margin: 2em auto;
padding: 1.2em 1.5em;
border: 1px solid #e1e1e1;
border-radius: 0.25em;
}
.entry-form-policy .description {
font-size: 87.5%;
}
.entry-form-policy-agree {
margin-top: 1em;
padding-top: 1em;
border-top: 1px solid hsla(0, 0%, 88.2%, 0.3);
text-align: center;
}
.entry-form-policy-agree .checkbox {
margin: 0;
padding: 0;
}
.entry-form-confirm-message {
margin: 1.5em 0;
}
.entry-form-action {
margin: 2em 0;
text-align: center;
}
.entry-form-unavailable {
margin: 1.5em 0;
padding: 1.5em 2em;
font-size: 87.5%;
color: rgba(51, 51, 51, 0.7);
background: #003FC0;
}
.entry-done-back {
margin: 3em 0;
text-align: center;
}
.action-box {
margin: 2em 0;
text-align: center;
}
.action-box .btn {
min-width: 10em;
}
.txfig {
box-sizing: border-box;
margin-bottom: 2em;
}
.form-item:after,
.form-sec > .hd-group:after,
.txfig:after {
content: "";
display: block;
line-height: 0;
clear: both;
}
.txfig ~ .txfig {
margin-top: 2em;
}
.txfig .p:first-child {
margin-top: 0;
}
.txfig .p:last-child {
margin-bottom: 0;
}
.txfig > .fig,
.txfig > .tx {
display: block;
padding: 0;
box-sizing: border-box;
}
.txfig > .tx {
width: 64.66%;
}
.txfig > .fig {
width: 33.33%;
margin: 0 auto 1em;
text-align: center;
}
.txfig > .fig.sm {
max-width: 60%;
}
.txfig-left > .tx {
float: right;
}
.txfig-left > .fig,
.txfig-right > .tx {
float: left;
}
.txfig-right > .fig {
float: right;
}
.fig-box {
box-sizing: border-box;
margin: 2em 0;
text-align: center;
}
.fig-box:first-child,
.heading + .fig-box,
.subhead + .fig-box {
margin-top: 0;
}
.fig-box:last-child {
margin-bottom: 0;
}
.fig-box-compact {
margin-top: 1.5em;
margin-bottom: 1.5em;
}
.fig-box-compact:first-child {
margin-top: 0;
}
.fig-box-compact:last-child {
margin-bottom: 0;
}
.fig-box-inner {
display: flex;
width: 100%;
}
.fig-box-item img {
width: 100%;
}
.fig-box-inner > .fig-box-item {
display: table-cell;
vertical-align: top;
padding: 0.3125rem 0.625rem;
box-sizing: border-box;
}
.fig-box-item > .caption {
display: block;
margin: 0.25rem 0;
font-size: 87.5%;
line-height: 1.333;
}
.fig-box-item a {
text-decoration: none;
}
.fig-box-item .image-link {
display: inline-block;
vertical-align: top;
}
.fig-box-item a img {
border: 1px solid #fff;
}
.home-slide-wrap {
overflow: hidden;
padding: 0 !important;
}
.home-slide-wrap + .home-slide-wrap {
margin-top: 0.5rem;
}
.home-slide-cnt {
position: relative;
}
.home-slide-cnt.draggable {
cursor: -webkit-grab;
cursor: grab;
}
.home-slide-cnt .glider-track {
align-items: stretch;
transform: translateZ(0);
width: 100%;
margin: 0;
padding: 0;
display: flex;
z-index: 1;
}
.home-slide-cnt .dots {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: 0 auto;
height: 0;
}
.home-slide-cnt .dots,
.home-slide-cnt .glider-dot {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
padding: 0;
}
.home-slide-cnt .glider-dot {
display: block;
width: 12px;
height: 12px;
margin: 0 7px;
color: #fff;
background: rgba(0, 0, 0, 0.1);
border: 1px solid;
border-radius: 9px;
cursor: pointer;
outline: none;
position: relative;
top: -1.75rem;
box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.33);
}
.home-slide-cnt .glider-dot.active {
background: #fff;
}
.home-slide-frame {
position: relative;
width: 100%;
margin: 0 auto;
}
.btn-slide-next,
.btn-slide-prev {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
position: absolute;
outline: none;
z-index: 1;
top: 50%;
height: 3.2rem;
margin-top: -1.7rem;
padding-left: 1rem;
padding-right: 1rem;
background: rgba(0, 0, 0, 0.35);
border: none;
border-radius: 0.4rem;
}
.btn-slide-next img,
.btn-slide-prev img {
vertical-align: top;
width: 0.7488rem;
height: 1.2rem;
margin-top: 0.08rem;
}
.btn-slide-prev {
left: -0.4rem;
}
.btn-slide-next {
right: -0.4rem;
}
.home-slide-list {
position: relative;
overflow-y: hidden;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: none;
transform: translateZ(0);
overflow: hidden;
overflow-x: hidden;
margin: 0 auto;
}
.home-slide-item {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
justify-content: center;
align-content: center;
}
@media screen and (max-width: 880px) {
.fig-box {
margin-top: 1.75em;
margin-bottom: 1.75em;
}
.fig-box-inner > .fig-box-item {
padding: 0.3125rem 0.4375rem;
display: block;
}
.map-box,
.social-box,
.video-box {
margin-top: 1.75em;
margin-bottom: 1.75em;
}
.txfig > .tx {
width: 100%;
}
.txfig > .fig {
width: 100%;
}
.txfig > .fig.sm {
max-width: 100%;
}
.txfig-left > .tx {
float: none;
}
.txfig-left > .fig,
.txfig-right > .tx {
float: none;
}
.txfig-right > .fig {
float: none;
}
.fig-box-inner {
display: block !important;
}
.fig-box-item > .caption {
margin: 0.5rem 0 1rem 0;
text-align: left;
}
}
/* TABLE
--------------------------------------------------------------------------*/
table.table-t1 {
width: 100%;
border-collapse: collapse;
margin: 0 0 1rem 0;
}
table.table-t1 th {
box-sizing: border-box;
width: 24%;
background-color: #eaecef;
text-align: left;
padding: 0.4rem 0.7rem;
border: solid 1px #C1BFB9;
}
table.table-t1 td {
box-sizing: border-box;
width: 76%;
background-color: #FFF;
padding: 0.4rem 0.7rem;
border: solid 1px #C1BFB9;
}
@media only screen and (max-width: 440px) {
.table-t1-bdr {
border-left: solid 1px #C1BFB9;
border-right: solid 1px #C1BFB9;
border-bottom: solid 1px #C1BFB9;
border-top: none;
}
table.table-t1 {
width: 100%;
border-top: solid 1px #C1BFB9;
margin: 0 0 1rem 0;
}
table.table-t1 tr {
display: block;
margin: 0;
}
table.table-t1 th {
width: 100%;
display: block;
border-left: solid 1px #C1BFB9;
border-right: solid 1px #C1BFB9;
border-bottom: solid 1px #C1BFB9;
border-top: none;
}
table.table-t1 td {
width: 100%;
display: block;
border-left: solid 1px #C1BFB9;
border-right: solid 1px #C1BFB9;
border-bottom: solid 1px #C1BFB9;
border-top: none;
}
}
/* Modal Window
--------------------------------------------------------------------------*/
.ly_fullsize {
width: 100%;
height: 100%;
}
input[type=checkbox] {
transition: all 0.3s;
box-sizing: border-box;
display: none;
}
.w-modal_overlay {
position: fixed;
width: 100%;
height: 100%;
overflow: hidden;
top: 0;
left: 0;
background: rgba(246, 244, 240, 0.98);
opacity: 0;
transition: opacity 0.3s, transform 0s 0.3s;
transform: scale(0);
z-index: 80000;
}
.w-modal_trigger {
position: fixed;
width: 100%;
height: 100%;
overflow: hidden;
z-index: 501;
}
.w-modal_content {
position: absolute;
display: none;
width: 100%;
height: 100%;
margin: auto;
overflow: auto;
box-sizing: border-box;
transform: scale(1.2);
transition: 0.3s;
z-index: 502;
}
.wm_close_button {
display: none;
position: fixed;
box-sizing: border-box;
width: 5rem;
height: 5rem;
top: 0;
right: 1.3rem;
padding: 1.3rem;
line-height: 1;
color: #FFF;
cursor: pointer;
z-index: 505;
}
.w-modal_wrap .cnt-box0 {
padding: 0 1rem 0 1rem;
}
.pp_modal-window-w {
position: relative;
box-sizing: border-box;
width: 100%;
margin: auto;
z-index: 503;
}
.pp_modal-window {
position: relative;
padding-bottom: 56.25%;
height: 0;
overflow: hidden;
}
.pp_modal-window iframe {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.pp-movie-box {
padding: 1rem;
}
.w-modal_wrap input:checked ~ .w-modal_overlay {
opacity: 1;
transform: scale(1);
transition: opacity 0.3s;
}
.w-modal_wrap input:checked ~ .w-modal_overlay .w-modal_content {
transform: scale(1);
display: flex;
}
.w-modal_wrap input:checked ~ .w-modal_overlay .wm_close_button {
display: block;
}
.w-modal_wrap input:checked ~ .w-modal_overlay .pp_modal-window {
display: block;
}
.wm_open_button {
position: relative;
display: block;
cursor: pointer;
transform: scale(1, 1);
transition: all 0.5s ease 0s;
z-index: 2;
}
.wm_open_button:hover {
transform: scale(1.05, 1.05);
}
@media screen and (max-width: 1100px) {
.wm_close_button {
right: 0rem;
width: 4rem;
height: 4rem;
padding: 1.1rem;
}
.pp-movie-box {
padding: 0;
}
.wm_open_button:hover {
transform: scale(1, 1);
z-index: 1;
}
}
/* Block
--------------------------------------------------------------------------*/
main article#top div.bsed.body-tx {
position: relative;
box-sizing: border-box;
width: 100%;
overflow: hidden;
}
main article#top div.bsed.body-tx h2,
main article#top div.bsed.body-tx h3,
main article#top div.bsed.body-tx h4,
main article#top div.bsed.body-tx h5,
main article#top div.bsed.body-tx p,
main article#top div.bsed.body-tx table,
main article#top div.bsed.body-tx ol,
main article#top div.bsed.body-tx ul,
main article#top div.bsed.body-tx div.video-box,
main article#top div.bsed.body-tx div.map-box,
main article#top div.bsed.body-tx div.fig-box {
width: 84%;
margin-right: 8%;
margin-left: 8%;
}
main article#top div.bsed.body-tx h2 {
font-size: 1.8rem;
line-height: 2.4rem;
letter-spacing: 0.08rem;
font-weight: 700;
margin: 1.6rem auto;
}
main article#top div.bsed.body-tx h3 {
font-size: 1.6rem;
line-height: 2.2rem;
font-weight: 700;
letter-spacing: 0.08rem;
border: 1px solid #BCBCBC;
padding: 0.5rem 1.5rem;
margin: 1.6rem auto;
}
main article#top div.bsed.body-tx h4 {
font-size: 1.4rem;
line-height: 2rem;
font-weight: 700;
letter-spacing: 0.08rem;
margin: 1.6rem auto;
color: #004D8C;
}
main article#top div.bsed.body-tx ol {
margin: 1rem auto;
}
main article#top div.bsed.body-tx ol li {
position: relative;
box-sizing: border-box;
list-style: decimal;
margin: 0 0 0 2rem;
}
main article#top div.bsed.body-tx ul {
margin: 1rem auto;
}
main article#top div.bsed.body-tx ul li {
position: relative;
box-sizing: border-box;
list-style: disc;
margin: 0 0 0 2rem;
}
main article#top div.bsed.body-tx p {
margin-bottom: 1rem;
}
main article#top div.bsed.body-tx .fig-box-item {
padding: 0 1rem 0 0;
}
main article#top div.bsed.body-tx .fig-box-item:last-child {
padding: 0;
}
/* Block-image-layout*/
main article#top div.txfig {
position: relative;
box-sizing: border-box;
width: 100%;
overflow: hidden;
}
main article#top div.txfig div.tx.bsed {
position: relative;
box-sizing: border-box;
display: block;
width: 60%;
margin-top: 3rem;
}
main article#top div.txfig div.tx.bsed h2,
main article#top div.txfig div.tx.bsed h3,
main article#top div.txfig div.tx.bsed h4,
main article#top div.txfig div.tx.bsed h5,
main article#top div.txfig div.tx.bsed p,
main article#top div.txfig div.tx.bsed table,
main article#top div.txfig div.tx.bsed ol,
main article#top div.txfig div.tx.bsed ul {
width: 100%;
margin-right: 0;
margin-left: 0;
}
main article#top div.txfig div.tx.bsed h2 {
margin: 0 auto 1.6rem auto;
}
main article#top div.txfig div.tx.bsed h3 {
border: none;
padding: 0;
margin: 0 auto 1.6rem auto;
}
main article#top div.txfig div.tx.bsed h4 {
margin: 0 auto 1.6rem auto;
border-bottom: 1px dotted #ADADAD;
padding-bottom: 0.5rem;
}
main article#top div.txfig div.fig {
position: relative;
box-sizing: border-box;
display: block;
width: 40%;
}
main article#top div.txfig.txfig-left div.tx.bsed {
padding: 6rem 7% 5rem 5%;
}
main article#top div.txfig.txfig-left div.tx.bsed h2,
main article#top div.txfig.txfig-left div.tx.bsed h3,
main article#top div.txfig.txfig-left div.tx.bsed h4,
main article#top div.txfig.txfig-left div.tx.bsed p,
main article#top div.txfig.txfig-left div.tx.bsed li {
color: #434343 !important;
}
main article#top div.txfig.txfig-left div.tx.bsed:before {
content: "";
position: absolute;
box-sizing: border-box;
display: block;
width: 120%;
height: 100%;
background: #f6f9fb;
top: 0;
right: 0;
z-index: -1;
}
main article#top div.txfig.txfig-left div.fig .fig-box-item span.caption {
position: relative;
box-sizing: border-box;
display: block;
width: 60%;
margin: 0.8rem 35% 0.8rem 5%;
text-align: left;
}
main article#top div.txfig.txfig-right div.tx.bsed {
padding: 6rem 5% 5rem 7%;
color: #FFF !important;
}
main article#top div.txfig.txfig-right div.tx.bsed h2,
main article#top div.txfig.txfig-right div.tx.bsed h3,
main article#top div.txfig.txfig-right div.tx.bsed h4,
main article#top div.txfig.txfig-right div.tx.bsed p,
main article#top div.txfig.txfig-right div.tx.bsed li {
color: #FFF !important;
}
main article#top div.txfig.txfig-right div.tx.bsed:before {
content: "";
position: absolute;
box-sizing: border-box;
display: block;
width: 120%;
height: 100%;
background: #262626;
top: 0;
left: 0;
z-index: -1;
}
main article#top div.txfig.txfig-right div.fig .fig-box-item span.caption {
position: relative;
box-sizing: border-box;
display: block;
width: 60%;
margin: 0.8rem 5% 0.8rem 35%;
text-align: right;
}
@media screen and (max-width: 880px) {
main article#top div.bsed.body-tx {
position: relative;
box-sizing: border-box;
width: 100%;
overflow: hidden;
}
main article#top div.bsed.body-tx h2,
main article#top div.bsed.body-tx h3,
main article#top div.bsed.body-tx h4,
main article#top div.bsed.body-tx h5,
main article#top div.bsed.body-tx p,
main article#top div.bsed.body-tx table,
main article#top div.bsed.body-tx ol,
main article#top div.bsed.body-tx ul,
main article#top div.bsed.body-tx div.video-box,
main article#top div.bsed.body-tx div.map-box,
main article#top div.bsed.body-tx div.fig-box {
width: 84%;
margin-right: 8%;
margin-left: 8%;
}
main article#top div.bsed.body-tx h2 {
font-size: 1.4rem;
line-height: 2rem;
margin: 1.2rem auto;
}
main article#top div.bsed.body-tx h3 {
font-size: 1.2rem;
line-height: 1.8rem;
padding: 0.5rem 1.5rem;
margin: 1.2rem auto;
}
main article#top div.bsed.body-tx h4 {
font-size: 1rem;
line-height: 1.6rem;
margin: 1.2rem auto;
color: #004D8C;
}
main article#top div.bsed.body-tx ol {
margin: 1rem auto;
}
main article#top div.bsed.body-tx ol li {
position: relative;
box-sizing: border-box;
list-style: decimal;
margin: 0 0 0 2rem;
}
main article#top div.bsed.body-tx ul {
margin: 1rem auto;
}
main article#top div.bsed.body-tx ul li {
position: relative;
box-sizing: border-box;
list-style: disc;
margin: 0 0 0 2rem;
}
main article#top div.bsed.body-tx p {
margin-bottom: 1rem;
}
main article#top div.bsed.body-tx .fig-box-item {
padding: 0 1rem 0 0;
}
main article#top div.bsed.body-tx .fig-box-item:last-child {
padding: 0;
}
/* Block-image-layout*/
main article#top div.txfig {
position: relative;
box-sizing: border-box;
width: 100%;
overflow: hidden;
}
main article#top div.txfig div.tx.bsed {
position: relative;
box-sizing: border-box;
display: block;
width: 94%;
margin-top: 2vw;
}
main article#top div.txfig div.tx.bsed h2,
main article#top div.txfig div.tx.bsed h3,
main article#top div.txfig div.tx.bsed h4,
main article#top div.txfig div.tx.bsed h5,
main article#top div.txfig div.tx.bsed p,
main article#top div.txfig div.tx.bsed table,
main article#top div.txfig div.tx.bsed ol,
main article#top div.txfig div.tx.bsed ul {
width: 100%;
margin-right: 0;
margin-left: 0;
}
main article#top div.txfig div.tx.bsed h2 {
margin: 0 auto 1.2rem auto;
}
main article#top div.txfig div.tx.bsed h3 {
border: none;
padding: 0;
margin: 0 auto 1.2rem auto;
}
main article#top div.txfig div.tx.bsed h4 {
margin: 0 auto 1.2rem auto;
padding-bottom: 0.5rem;
}
main article#top div.txfig div.fig {
box-sizing: border-box;
display: block;
position: relative;
width: 90%;
top: -7vw;
}
main article#top div.txfig.txfig-left div.tx.bsed {
margin-left: 6%;
padding: 8vw 10% 14vw 10%;
}
main article#top div.txfig.txfig-left div.tx.bsed h2,
main article#top div.txfig.txfig-left div.tx.bsed h3,
main article#top div.txfig.txfig-left div.tx.bsed h4,
main article#top div.txfig.txfig-left div.tx.bsed p,
main article#top div.txfig.txfig-left div.tx.bsed li {
color: #434343 !important;
}
main article#top div.txfig.txfig-left div.tx.bsed:before {
content: "";
position: absolute;
box-sizing: border-box;
display: block;
width: 100%;
height: 100%;
background: #f6f9fb;
top: 0;
right: 0;
z-index: -1;
}
main article#top div.txfig.txfig-left div.fig {
left: 0;
margin: 0 10% -7vw 0;
}
main article#top div.txfig.txfig-left div.fig .fig-box-item span.caption {
position: relative;
box-sizing: border-box;
display: block;
width: 90%;
margin: 0.8rem 5% 0.8rem 5%;
text-align: left;
}
main article#top div.txfig.txfig-right div.tx.bsed {
margin-left: 6%;
padding: 8vw 10% 14vw 10%;
color: #FFF !important;
}
main article#top div.txfig.txfig-right div.tx.bsed h2,
main article#top div.txfig.txfig-right div.tx.bsed h3,
main article#top div.txfig.txfig-right div.tx.bsed h4,
main article#top div.txfig.txfig-right div.tx.bsed p,
main article#top div.txfig.txfig-right div.tx.bsed li {
color: #FFF !important;
}
main article#top div.txfig.txfig-right div.tx.bsed:before {
content: "";
position: absolute;
box-sizing: border-box;
display: block;
width: 100%;
height: 100%;
background: #262626;
top: 0;
left: 0;
z-index: -1;
}
main article#top div.txfig.txfig-right div.fig {
left: 0;
right: auto;
margin: 0 10% -7vw 0;
}
main article#top div.txfig.txfig-right div.fig .fig-box-item span.caption {
position: relative;
box-sizing: border-box;
display: block;
width: 90%;
margin: 0.8rem 5% 0.8rem 5%;
text-align: left;
}
}
/* Clear
--------------------------------------------------------------------------*/
.clear:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clear {
display: inline-table;
}
/* \*/
* html .clear {
height: 1%;
}
.clear {
display: block;
}
/* */