@charset "utf-8";
@charset "UTF-8";


@import url("https://fonts.googleapis.com/css?family=Libre+Baskerville:400,700|Noto+Sans+JP:400,700,900&display=swap");
.clearfix, .post-categories, .shortwrap, .wrap {
*zoom: 1;
}
.clearfix:after, .post-categories:after, .shortwrap:after, .wrap:after {
content: "";
display: table;
clear: both;
}
html {
font-size: 62.5%;
}
body {
font-size: 1.5em;
background: #FFF;
font-family: "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
-moz-osx-font-smoothing: grayscale;
line-height: 1.8;
padding: 0;
margin: 0;
vertical-align: baseline;
}
select, input, button, textarea {
font: 99% sans-serif;
}
table {
font-size: inherit;
font: 100%;
}
pre, code, kbd, samp, tt {
font-family: monospace;
*font-size: 108%;
line-height: 100%;
}
img {
max-width: 100%;
}
@media (max-width: 768px) {
img {
height: auto;
}
} @media (min-width: 768px) {
#pagetop {
position: fixed;
right: 8px;
bottom: -50px;
width: 41px;
height: 38px;
background: url(//siran.jp/wp-content/themes/siran/assets/images/common/img_pagetop.png) 0 0 no-repeat;
z-index: 3;
}
#pagetop a {
background: url(//siran.jp/wp-content/themes/siran/assets/images/common/img_pagetop_arrow.png) no-repeat scroll 0 0 rgba(0, 0, 0, 0);
display: block;
height: 35px;
margin-top: 3px;
text-indent: -9999px;
transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
width: 41px;
outline: none;
}
#pagetop a:hover {
background-position: 0 100%;
}
#pagetop a img {
display: block;
}
}
@media (max-width: 768px) {
#pagetop {
width: 38px;
height: 38px;
background: url(//siran.jp/wp-content/themes/siran/assets/images/common/pagetop2.png);
background-size: contain;
position: fixed;
right: 8px;
bottom: -50px;
text-indent: -9999px;
outline: none;
opacity: 0.7;
-moz-opacity: 0.7;
filter: alpha(opacity=70);
z-index: 3;
}
#pagetop a {
display: block;
width: 100%;
height: 100%;
text-indent: -9999px;
}
}
a {
text-decoration: none;
color: #575151;
outline: none;
font-weight: bold;
}
a:hover {
color: #1d84c6;
}
.wrap {
margin-left: auto;
margin-right: auto;
}
@media (min-width: 1200px) {
.wrap {
width: 1080px;
}
}
@media (max-width: 1200px) {
.wrap {
width: 92%;
}
}
.shortwrap {
margin-left: auto;
margin-right: auto;
}
@media (min-width: 1200px) {
.shortwrap {
width: 960px;
}
}
@media (max-width: 1200px) {
.shortwrap {
width: 92%;
}
}
#header {
background-color: transparent;
box-sizing: border-box;
z-index: 100;
width: 100%;
padding: 24px 0 56px;
text-align: center;
width: 100%;
transition: all 0.5s cubic-bezier(0.445, 0.05, 0.55, 0.95);
}
@media (max-width: 768px) {
#header {
padding: 12px 0 0;
}
}
#header #header_inner {
position: relative;
width: 100%;
max-width: 1180px;
margin: 0 auto;
height: 100px;
}
@media (max-width: 768px) {
#header #header_inner {
margin: 0 auto;
height: auto;
}
}
@media (max-width: 1200px) {
#header #header_inner:after {
content: ".";
display: block;
visibility: hidden;
height: 0;
clear: both;
}
}
@media (min-width: 768px) {
#main {
height: 100%;
}
}
#logo {
text-align: center;
transition: all 0.5s cubic-bezier(0.445, 0.05, 0.55, 0.95);
}
#logo a {
display: block;
outline: none;
text-indent: -9999px;
transition: all 0.3s ease 0s;
background: url(//siran.jp/wp-content/themes/siran/assets/images/common/logo.png) no-repeat center;
background-size: contain;
}
@media (min-width: 768px) {
#logo a {
width: 216px;
height: 66px;
margin: 0 auto;
}
}
@media (max-width: 768px) {
#logo a {
width: 147px;
height: 46px;
margin: 0 auto;
}
}
@media (min-width: 768px) {
#global_navi {
margin-top: 30px;
transition: all 0.5s cubic-bezier(0.445, 0.05, 0.55, 0.95);
}
}
@media (min-width: 768px) {
.fixed #global_navi {
top: 23px;
}
}
.fixed #global_navi .header-nav-item {
color: #4a4a4a;
}
@media (min-width: 768px) {
#navi_ul {
opacity: 1;
transition-property: opacity;
transition-duration: 0.15s;
transition-timing-function: ease-out;
}
}
@media (max-width: 768px) {
#navi_ul {
margin: 12px auto 0;
width: 100%;
display: flex;
flex-wrap: wrap;
border-top: 1px #ccc solid;
}
}
#navi_ul > li {
display: inline-block;
vertical-align: middle;
}
@media (max-width: 768px) {
#navi_ul > li {
width: 33.3333333333%;
display: flex;
border-bottom: 1px #ccc solid;
position: relative;
}
#navi_ul > li:not(:nth-child(3n))::after {
width: 1px;
height: 100%;
background-color: #ccc;
content: "";
display: block;
position: absolute;
right: 0;
top: 0;
}
}
.header-nav-item {
text-decoration: none;
position: relative;
}
@media (min-width: 768px) {
.header-nav-item {
display: inline-block;
height: 50px;
line-height: 50px;
padding: 0 30px;
color: #333;
}
}
@media (max-width: 768px) {
.header-nav-item {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
padding: 8px 5px;
font-size: 1.1rem;
}
}
@media (min-width: 768px) {
.header-nav-item:hover {
color: #de9a34;
}
}
@media (min-width: 768px) {
.sp_only {
display: none;
}
}
@media (min-width: 768px) {
.p_only {
display: inherit;
}
}
@media (max-width: 768px) {
.p_only {
display: none;
}
}
.copyright {
letter-spacing: 0.02em;
line-height: 1;
display: block;
color: #999;
margin-top: 30px;
padding-bottom: 50px;
text-align: center;
font-size: 1.3rem;
font-weight: bold;
}
@media (max-width: 768px) {
.copyright {
padding-bottom: 95px;
}
}
.btn {
display: inline-block;
transition: all 0.3s ease 0s;
text-decoration: none;
padding: 10px 25px;
position: relative;
text-align: center;
box-sizing: border-box;
font-weight: bold;
}
@media (min-width: 768px) {
.btn {
min-width: 210px;
}
}
@media (max-width: 768px) {
.btn {
padding: 10px 30px;
display: block;
width: 100%;
}
}
.btn i {
position: absolute;
right: 10px;
top: 50%;
margin-top: -7px;
}
@media (max-width: 768px) {
.btn i {
margin-top: -7px;
}
}
.btn.btn-block {
display: block;
width: 90%;
max-width: 600px;
margin-left: auto;
margin-right: auto;
text-align: center;
}
.btn-blue {
color: #fff;
background-color: #97d5de;
border: 2px #97d5de solid;
}
.btn-blue:hover {
background-color: #fff;
color: #97d5de;
}
.btn-orange {
color: #fff;
background-color: #f5802f;
border: 2px #f5802f solid;
}
.btn-orange:hover {
background-color: #fff2e7;
color: #f5802f;
} .list-disc, .alert ul {
margin-left: 21px;
}
.list-disc li, .alert ul li {
list-style: disc;
}
.list-disc li b, .alert ul li b {
display: inline-block;
margin-right: 10px;
}
.list-decimal {
margin-left: 20px;
}
.list-decimal li {
list-style: decimal;
}
.list-decimal li b {
display: inline-block;
margin-right: 10px;
} #main_wrap {
display: block;
}
#mainVisual {
width: 100%;
box-sizing: border-box;
position: relative;
max-width: 1600px;
margin: 0 auto;
}
@media (min-width: 1200px) {
#mainVisual {
margin-top: 15px;
padding: 0 0 0 360px;
}
}
@media (min-width: 768px) and (max-width: 1200px) {
#mainVisual {
margin-top: 15px;
padding: 0 0 0 33%;
}
}
#mainVisual .main_slider {
width: 100%;
height: 72vh;
}
@media (min-width: 768px) and (max-width: 1200px) {
#mainVisual .main_slider {
height: 480px;
}
}
@media (max-width: 768px) {
#mainVisual .main_slider {
height: auto;
}
}
#mainVisual .main_slider .swiper-slide {
width: 100%;
height: 100%;
overflow: hidden;
}
@media (min-width: 1200px) {
#mainVisual .main_slider .swiper-slide img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
}
}
#mainVisual .main_display {
width: 100%;
z-index: 1;
position: absolute;
left: 0;
}
@media (min-width: 768px) {
#mainVisual .main_display {
display: flex;
align-items: center;
justify-content: flex-start;
top: 50%;
transform: translateY(-50%);
}
}
@media (max-width: 768px) {
#mainVisual .main_display {
background: rgba(255, 255, 255, 0.5);
z-index: 10;
bottom: 0;
padding: 24px 0;
}
}
#mainVisual .main_display .main_inner {
color: #333;
}
@media (min-width: 768px) {
#mainVisual .main_display .main_inner {
display: table-cell;
vertical-align: middle;
background-color: white;
width: 360px;
padding: 40px;
}
}
@media (max-width: 768px) {
#mainVisual .main_display .main_inner {
padding: 0 10%;
}
}
#mainVisual .main_display .main_inner .main_text {
font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
font-size: 5rem;
font-weight: normal;
line-height: 1.3;
}
@media (max-width: 768px) {
#mainVisual .main_display .main_inner .main_text {
font-size: 2rem;
}
#mainVisual .main_display .main_inner .main_text br {
display: none;
}
}
#mainVisual .main_display .main_inner .main_text_en {
font-family: "Libre Baskerville", serif;
font-size: 2rem;
font-weight: 400;
letter-spacing: 0.05em;
margin-top: 25px;
}
@media (max-width: 768px) {
#mainVisual .main_display .main_inner .main_text_en {
font-size: 1.1rem;
margin-top: 5px;
}
#mainVisual .main_display .main_inner .main_text_en br {
display: none;
}
#mainVisual .main_display .main_inner .main_text_en span {
display: inline-block;
width: 16px;
}
}
.top-section {
padding: 80px 0;
}
@media (max-width: 768px) {
.top-section {
padding: 40px 0;
}
}
.section_title {
text-align: center;
margin-bottom: 40px;
}
@media (max-width: 768px) {
.section_title {
margin-bottom: 20px;
}
}
.section_title .section_title_en {
font-family: "Libre Baskerville", serif;
font-size: 2.4rem;
font-weight: 700;
}
.conception {
text-align: center;
font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
font-size: 3.6rem;
font-weight: normal;
margin-top: 40px;
}
@media (max-width: 768px) {
.conception {
font-size: 2.1rem;
font-weight: bold;
}
}
.concept_text {
font-size: 1.6rem;
}
@media (min-width: 768px) {
.concept_text {
text-align: center;
line-height: 2;
}
}
.concept_text p {
margin-bottom: 15px;
}
@media (max-width: 768px) {
.concept_text p {
font-size: 1.4rem;
}
}
.menus {
position: relative;
display: block;
}
.menus .menu-text ul li:not(:first-child) {
margin-top: 25px;
}
.menus .menu-text .menu-name {
position: relative;
padding: 9px 0;
font-weight: 700;
color: #222;
}
.menus .menu-text .menu-name h4 {
font-family: "Libre Baskerville", serif;
font-size: 1.4rem;
font-weight: 700;
}
.menus .menu-text .menu-content {
font-size: 1.3rem;
color: #222;
border-bottom: 1px solid #eee;
padding: 10px 0 20px;
overflow: hidden;
}
.menus .menu-text .menu-content p {
font-size: 11px;
margin: 10px 0 5px;
}
.menus .menu-text .menu-content hr {
background-color: #eee;
margin: 15px 0;
}
.menus .menu-text .menu-content h3 {
font-weight: 700;
margin-bottom: 10px;
color: #999;
}
.menus .menu-text .menu-content table {
width: 100%;
margin: 0;
color: #333;
}
.menus .menu-text .menu-content table tr {
background: url(//siran.jp/wp-content/themes/siran/assets/images/common/dot.gif) 0 17px repeat-x;
}
.menus .menu-text .menu-content table tr td {
padding: 5px 0;
font-weight: 400;
vertical-align: top;
}
.menus .menu-text .menu-content table tr td.pri {
text-align: right;
}
.menus .menu-text .menu-content table tr td.pri span {
padding: 0 0 0 10px;
}
.menus .menu-text .menu-content table tr td span {
display: inline-block;
background-color: #fff;
padding: 0 10px 0 0;
}
.menus .menu-text .menu-content table tr td span.small-text {
font-size: 11px;
}
.menus .menu-text .attention {
color: #888;
font-size: 11px;
margin: 10px 0;
}
img.credit_card {
display: block;
width: 200px;
}
@media all and (min-width: 768px) {
.menus .menu-text,
.menus .menu-img {
float: left;
width: 50%;
box-sizing: border-box;
}
.menus .menu-text .menu-content .half-box {
width: 50%;
float: left;
}
.menus .menu-text .menu-content .half-box:first-child {
padding-right: 10px;
}
.menus .menu-text .menu-content .half-box:last-child {
padding-left: 10px;
}
}
@media all and (min-width: 940px) {
.menus .menu-text,
.menus .menu-img {
padding: 20px;
}
.menus .menu-text .menu-content .half-box:first-child {
padding-right: 20px;
}
.menus .menu-text .menu-content .half-box:last-child {
padding-left: 20px;
}
.menus .menu-text .attention {
margin: 20px 0;
}
}
.top_news_section {
padding: 80px 0;
}
@media (max-width: 768px) {
.top_news_section {
padding: 40px 0;
}
}
.section_title {
text-align: center;
}
@media (max-width: 768px) {
.section_title {
width: 100%;
margin: 0 auto 25px;
}
}
.section_title .en_title {
font-family: "Libre Baskerville", serif;
font-size: 4rem;
font-weight: 700;
color: #333;
}
footer {
position: relative;
width: 100%;
margin: 0;
display: block;
z-index: 2;
}
.footer-space {
display: block;
height: 100px;
}
.section-inner {
position: relative;
max-width: 1080px;
margin: 0 auto;
padding: 40px 30px;
display: block;
}
@media (max-width: 768px) {
.section-inner {
padding: 24px 6%;
}
}
.section-inner hr {
margin: 10px 0;
height: 1px;
border: none;
outline: none;
display: block;
background-color: #333;
}
.section-inner > h2.padMin {
padding-bottom: 10px;
}
.section-content {
position: relative;
margin: 0 auto;
display: block;
overflow: hidden;
}
.section-content:after {
content: "";
height: 0;
margin: 0;
display: block;
clear: both;
}
.section-content a.page-link {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
background-image: url(//siran.jp/wp-content/themes/siran/assets/css/about:blank);
display: block;
}
.table {
width: 100%;
height: 100%;
display: table;
}
* html div.table {
position: relative;
}
* + html div.table {
position: relative;
}
.table-cell {
text-align: center;
vertical-align: middle;
display: table-cell;
}
* html .table-cell {
position: absolute;
}
* + html .table-cell {
position: absolute;
}
.ta-left {
text-align: left;
}
.absolute-block {
position: absolute;
display: block;
width: 100%;
height: 100%;
left: 0;
top: 0;
background-color: #000;
color: #fff;
}
.box-text {
background-color: rgba(0, 0, 0, 0.5);
display: inline-block;
font-size: 11px;
margin-top: 10px;
padding: 5px 15px;
border-radius: 30px;
}
.media-holder {
position: relative;
width: 100%;
height: 0;
padding: 0 0 66%;
overflow: hidden;
transition: padding 250ms ease-out;
}
#instafeed .media-holder {
padding: 0 0 100%;
}
.media-holder.h16 {
padding: 0 0 16.66%;
}
.media-holder.h30 {
padding: 0 0 30%;
}
.media-holder.h33 {
padding: 0 0 33%;
}
.media-holder.h50 {
padding: 0 0 50%;
}
.media-holder.h56 {
padding: 0 0 56%;
}
.media-holder.h67 {
padding: 0 0 67%;
}
.media-holder img, .media-holder iframe, .media-holder video, .media-holder embed {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
overflow: hidden;
}
.media-holder img {
height: auto;
max-height: 100%;
} .map-container {
width: 100%;
margin-top: 10px;
padding: 0;
text-align: center;
position: relative;
display: block;
overflow: hidden;
opacity: 1;
filter: alpha(opacity=100);
}
.show .map-container {
top: 80px;
opacity: 1;
filter: alpha(opacity=100);
}
.map-container section {
margin: 0 80px;
position: relative;
background-color: #eee;
overflow: hidden;
display: block;
height: 100%;
}
.map-container #contact-map {
position: relative;
width: 100%;
height: 200px;
color: #222;
background-color: #999;
}
#exhibit {
position: relative;
margin: 0;
padding: 45px 0 0;
list-style: none;
width: 100%;
display: block;
color: #222;
}
#exhibit h3 {
font-size: 15px;
letter-spacing: 3px;
margin-bottom: 35px;
}
#exhibit h2 {
font-weight: 700;
font-size: 13px;
letter-spacing: 3px;
margin-bottom: 5px;
}
#exhibit th {
padding: 5px 10px 5px 0;
font-size: 11px;
font-weight: 400;
letter-spacing: 1px;
}
#exhibit td {
padding: 0 0 0 5px;
font-size: 12px;
font-family: "apercu", "YuGothic", "Yu Gothic", Hiragino Kaku Gothic Pro, Meiryo, Osaka, sans-serif;
}
#exhibit .social {
padding: 0;
display: block;
position: relative;
width: auto;
border-left: none;
}
#exhibit .social li {
float: left;
}
#exhibit .social li.sepa {
display: block;
width: 1px;
height: 20px;
background-color: #ccc;
margin: 5px 15px 5px 0;
}
#exhibit .social li a {
display: block;
margin: 0 15px 0 0;
font-size: 12px;
letter-spacing: 1px;
line-height: 30px;
}
#exhibit .social li a span {
padding-left: 20px;
}
#exhibit .social li a.social-link {
position: relative;
display: block;
width: 20px;
height: 30px;
margin: 0 10px 0 0;
}
#exhibit .social li a svg {
position: absolute;
left: 0;
top: 0;
width: 20px;
height: 30px;
}
#exhibit .info-box {
display: block;
border-top: 1px solid #ccc;
padding-top: 35px;
margin-top: 26px;
}
#exhibit .reserve-link-foot a {
margin-top: 15px;
padding: 10px;
border: 1px solid #ccc;
text-align: center;
font-size: 12px;
display: block;
transition: all 0.5s ease;
}
#exhibit .reserve-link-foot a:hover {
background: #000;
color: #FFF;
border: 1px solid #000;
}
#toggle_exhibit_key a {
display: block;
border: 1px solid #ccc;
padding: 8px;
margin: 20px 0 0;
color: #222;
transition: all 0.5s ease;
}
#toggle_exhibit_key a:hover {
background-color: #fff;
color: #999;
}
#toggle_exhibit_key {
display: none;
position: absolute;
top: 0;
left: 320px;
width: 30px;
height: 30px;
background-color: #fff;
transition: none;
}
#toggle_exhibit_key svg {
width: 20px;
height: 20px;
margin: 5px;
}
#toggle_exhibit_key.on svg {
transform: rotateY(180deg);
}
@media screen and (min-width: 768px) {
.map-container {
margin-top: 20px;
}
.map-container #contact-map {
height: 100%;
}
#exhibit {
position: absolute;
top: 0;
height: 100%;
left: 0;
margin: 0;
padding: 20px 33px;
list-style: none;
width: 320px;
background: rgba(255, 255, 255, 0.85);
display: block;
}
#toggle_exhibit_key {
display: block;
}
#exhibit .social li.sepa {
margin: 5px 10px 5px 20px;
}
#exhibit .social li a {
font-size: 13px;
margin: 0 0 0 20px;
}
#exhibit .social li a.social-link {
margin: 0 0 0 10px;
}
#exhibit a {
color: #666;
transition: all 0.3s ease-in-out;
}
#exhibit a svg {
fill: #666;
transition: all 0.3s ease-in-out;
}
#exhibit a:hover {
color: #000;
}
#exhibit a:hover svg {
fill: #000;
}
}
table.serif {
width: 100%;
}
.fixedMenu {
display: flex;
justify-content: space-between;
align-items: center;
height: 60px;
box-sizing: border-box;
position: fixed;
z-index: 4;
}
@media (min-width: 768px) {
.fixedMenu {
width: 300px;
top: 0;
right: 0;
}
}
@media (max-width: 768px) {
.fixedMenu {
width: 100%;
height: 48px;
bottom: 0;
box-shadow: 0 -5px 5px rgba(0, 0, 0, 0.1);
}
}
.fixedMenu .foot_tel {
width: 60%;
height: 100%;
background: #fff;
text-align: center;
display: table;
}
@media (max-width: 768px) {
.fixedMenu .foot_tel {
width: calc(70% - 116px);
}
}
.fixedMenu .foot_tel .inner {
display: table-cell;
vertical-align: middle;
}
.fixedMenu .foot_tel .inner p {
font-size: 1.2rem;
line-height: 1.4;
color: #333;
}
.fixedMenu .foot_tel .inner .foot_telnum {
color: #333;
line-height: 1.2;
letter-spacing: 0.05em;
}
@media (min-width: 768px) {
.fixedMenu .foot_tel .inner .foot_telnum {
font-family: "Libre Baskerville", serif;
font-size: 1.3rem;
font-weight: 700;
}
}
@media (max-width: 768px) {
.fixedMenu .foot_tel .inner .foot_telnum {
font-size: 1rem;
}
}
@media (min-width: 768px) {
.fixedMenu .foot_tel .inner .foot_telnum span {
font-family: "Libre Baskerville", serif;
font-size: 1.6rem;
font-weight: 700;
}
}
@media (max-width: 768px) {
.fixedMenu .foot_tel .inner .foot_telnum span {
font-size: 1.5rem;
}
}
.fixedMenu .foot_reserve {
display: table;
width: 40%;
height: 100%;
background: #97d5de;
}
@media (max-width: 768px) {
.fixedMenu .foot_reserve {
width: 30%;
}
}
.fixedMenu .foot_reserve .inner {
width: 100%;
display: table-cell;
vertical-align: middle;
text-align: center;
color: #fff;
font-size: 1.3rem;
}
.fixedMenu .foot_reserve .inner i {
display: block;
margin: 4px auto 1px;
line-height: 1;
font-size: 1.6rem;
}
@media (min-width: 768px) {
.fixedMenu .line_official {
display: none;
}
}
@media (max-width: 768px) {
.fixedMenu .line_official {
background-color: #00ba00;
display: block;
width: 116px;
height: 100%;
position: relative;
}
.fixedMenu .line_official img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
height: auto;
max-width: 110px;
}
}
@media all and (min-width: 320px) {
#instafeed .media-holder {
padding: 0 0 100%;
}
.insta {
position: relative;
display: block;
width: 100%;
}
.insta li {
box-sizing: border-box;
position: relative;
float: left;
width: 50%;
padding: 0;
}
.insta li a {
display: block;
}
.insta li img {
display: block;
width: 100%;
transition: all 444ms cubic-bezier(0.165, 0.84, 0.44, 1);
}
.more-btn {
display: block;
width: 120px;
text-align: center;
margin: 10px auto 30px;
border: 1px solid #000;
line-height: 40px;
color: #000;
transition: all 666ms 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
}
}
@media all and (max-width: 767px) {
.insta li {
margin-bottom: 10px;
}
.insta li:nth-child(2n) {
padding-left: 5px;
}
.insta li:nth-child(2n+1) {
padding-right: 5px;
}
.insta li:nth-child(9),
.insta li:nth-child(10),
.insta li:nth-child(11),
.insta li:nth-child(12) {
display: none;
}
.secondary-text-block p {
font-size: 14px;
line-height: 1.5;
}
.secondary-text-block01 {
margin-bottom: 50px;
}
}
@media all and (min-width: 768px) {
.insta {
margin-top: -40px;
}
.insta li {
padding: 20px;
width: 33.3333%;
}
.insta li:hover img {
transform: scale3d(1.09, 1.09, 1);
}
.more-btn:hover {
background-color: #000;
color: #fff;
}
}
@media all and (min-width: 940px) {
.insta li {
width: 25%;
}
}
#aside01 .bg {
background: url(//siran.jp/wp-content/themes/siran/assets/images/top/bg01.jpg) no-repeat center;
background-size: cover;
}
#aside01 .content-inner-y-ex {
padding-top: 80px;
padding-bottom: 60px;
}
@media (max-width: 768px) {
#aside01 .content-inner-y-ex {
padding-top: 20px;
padding-bottom: 50px;
}
}
@media (min-width: 768px) {
#aside01 .content-inner-y-ex .justify-content-between {
display: flex;
justify-content: space-between;
}
}
@media (max-width: 768px) {
#aside01 .content-inner-y-ex .justify-content-between {
display: block;
}
}
.top-contbox {
position: relative;
}
@media (min-width: 768px) {
.top-contbox {
width: 45%;
}
}
@media (max-width: 768px) {
.top-contbox {
display: block;
width: 100%;
}
}
.border-wrap {
border: 5px solid transparent;
}
.border-wrap::before, .border-wrap::after {
background-color: #ae9cde;
content: "";
display: block;
position: absolute;
z-index: 1;
transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
}
.border-wrap::before {
right: 50px;
}
.border-wrap::before {
bottom: 0;
height: 5px;
right: 20px;
width: 0;
}
.border-wrap.moved::before {
width: 100%;
width: calc(100% - 40px);
}
.border-wrap.moved .wrap-inner::before {
height: 100%;
}
.border-wrap.moved .wrap-inner::after {
height: 100%;
}
.wrap-inner {
padding: 30px 0;
}
.wrap-inner::before, .wrap-inner::after {
background-color: #ae9cde;
content: "";
display: block;
position: absolute;
z-index: 1;
transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
}
.wrap-inner::after {
left: -35px;
bottom: 0;
height: 0;
width: 5px;
}
.wrap-inner .btn-wrap {
margin-top: -20px;
text-align: right;
}
.title-primary {
font-family: "Libre Baskerville", serif;
font-size: 2.8rem;
font-weight: 700;
color: #ae9cde;
letter-spacing: 2px;
}
.title-primary span {
display: block;
font-size: 1.3rem;
}
.btn-has-arrow {
position: relative;
padding: 12px 60px 8px 0;
text-align: left;
min-width: 120px;
border-bottom: 2px solid #111;
font-weight: 700;
color: #111;
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
display: inline-block;
}
.btn-has-arrow::before {
content: "";
position: absolute;
background-image: url(//siran.jp/wp-content/themes/siran/assets/images/top/icon-arrow-right.png);
background-size: 100%;
background-position: center center;
background-repeat: no-repeat;
width: 14px;
height: 11px;
right: 10px;
bottom: 12px;
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
}
.btn-has-arrow:hover::before {
right: 0;
}
.btn-has-arrow span {
color: #fff;
}
.color-white {
color: #fff;
}
.btn-has-arrow.larger {
border-bottom: 2px solid #111;
font-size: 1.2rem;
min-width: 150px;
line-height: 1.6;
}
@media (max-width: 768px) {
.btn-has-arrow.larger {
min-width: 130px;
}
}
.btn-has-arrow.larger::before {
width: 20px;
height: 16px;
bottom: 22px;
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
}
.btn-has-arrow.color-white {
border-bottom-color: #fff;
}
.btn-has-arrow.color-white::before {
background-image: url(//siran.jp/wp-content/themes/siran/assets/images/top/icon-arrow-right-white.png);
}
#main-image {
width: 100%;
position: relative;
overflow: hidden;
}
#main-image::before {
content: "";
position: absolute;
width: 75%;
height: 100%;
right: 0;
background-size: cover;
background-position: center center;
background-image: url(//siran.jp/wp-content/themes/siran/assets/images/top/bg01.jpg);
z-index: 1;
transition-property: opacity, transform;
}
@media (max-width: 768px) {
#main-image::before {
width: 80%;
background-position: center right -160px;
}
}
#main-image::after {
content: "";
position: absolute;
left: 25%;
bottom: 0;
width: 75%;
height: 100%;
background: #eaeff4;
z-index: 2;
overflow: hidden;
-webkit-animation: rightOut 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s forwards;
animation: rightOut 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s forwards;
}
@media (max-width: 768px) {
#main-image::after {
left: 20%;
width: 80%;
}
}
#main-image.main-about::before {
background-image: url(//siran.jp/wp-content/themes/siran/assets/images/page/main_about.jpg);
}
#main-image.main-menu::before {
background-image: url(//siran.jp/wp-content/themes/siran/assets/images/page/main_menu.jpg);
}
#main-image.main-access::before {
background-image: url(//siran.jp/wp-content/themes/siran/assets/images/page/main_access.jpg);
}
#main-image.main-flow::before {
background-image: url(//siran.jp/wp-content/themes/siran/assets/images/page/main_flow.jpg);
}
#main-image.main-faq::before {
background-image: url(//siran.jp/wp-content/themes/siran/assets/images/page/main_faq.jpg);
}
#main-image.main-srotas::before {
background-image: url(//siran.jp/wp-content/themes/siran/assets/images/page/main_srotas.jpg);
}
#main-image.main-interview::before {
background-image: url(//siran.jp/wp-content/themes/siran/assets/images/page/main_interview.jpg);
}
#main-image.main-news::before {
background-image: url(//siran.jp/wp-content/themes/siran/assets/images/page/main_news.jpg);
}
#main-image .page-title {
padding-top: 220px;
padding-bottom: 80px;
}
@media (max-width: 768px) {
#main-image .page-title {
padding-top: 60px;
padding-bottom: 60px;
}
}
#main-image .page-title h2 {
position: relative;
z-index: 1;
opacity: 0;
display: inline-block;
-webkit-animation: fadein 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) 1s forwards;
animation: fadein 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) 1s forwards;
}
@media (min-width: 768px) {
#main-image .page-title h2 {
background-color: #fff;
padding: 30px;
min-width: 220px;
}
}
#main-image .page-title h2 span {
display: block;
}
#main-image .page-title h2 span.en-title {
font-family: "Libre Baskerville", serif;
font-size: 3.2rem;
font-weight: 700;
letter-spacing: 0.4rem;
color: #ae9cde;
}
@media (max-width: 768px) {
#main-image .page-title h2 span.en-title {
font-size: 1.9rem;
}
}
#main-image .page-title h2 span.jp-title {
margin-top: 5px;
font-size: 1.4rem;
letter-spacing: 0.1rem;
}
@-webkit-keyframes fadein {
0% {
transform: translateY(20px);
opacity: 0;
}
100% {
transform: translateY(0);
opacity: 1;
}
}
@keyframes fadein {
0% {
transform: translateY(20px);
opacity: 0;
}
100% {
transform: translateY(0);
opacity: 1;
}
}
@-webkit-keyframes rightOut {
0% {
left: 25%;
}
100% {
left: 100%;
}
}
@keyframes rightOut {
0% {
left: 25%;
}
100% {
left: 100%;
}
}
@media (min-width: 768px) {
.section_type01 {
display: inline-flex;
flex-wrap: wrap;
align-items: flex-start;
align-content: flex-start;
}
}
@media (min-width: 768px) {
.section_type01 .type01_title {
width: 30%;
}
}
.section_type01 .type01_title .section_title_en {
font-family: "Libre Baskerville", serif;
font-size: 3rem;
font-weight: 700;
color: #ae9cde;
}
@media (min-width: 768px) {
.section_type01 .type01_inner {
width: 65%;
}
}
.section_type01 .type01_inner h3 {
font-size: 2.8rem;
margin-bottom: 30px;
}
@media (max-width: 768px) {
.section_type01 .type01_inner h3 {
font-size: 1.8rem;
}
}
.section_type01 .type01_inner .concept_text {
text-align: left;
line-height: 2;
font-size: 1.5rem;
}
.concept_map {
max-width: 100%;
margin-top: 50px;
box-sizing: border-box;
display: block;
padding: 30px;
border: 1px #ddd solid;
}
@media (max-width: 768px) {
.concept_map {
margin-top: 30px;
padding: 20px;
}
}
.type02_title {
margin-bottom: 40px;
}
@media (min-width: 768px) {
.type02_title {
display: flex;
justify-content: space-between;
align-items: center;
align-items: flex-start;
}
}
@media (min-width: 768px) {
.type02_title .title_side {
width: 50%;
}
}
.type02_title .title_side .section_title_en {
font-family: "Libre Baskerville", serif;
font-size: 3rem;
font-weight: 700;
color: #ae9cde;
}
.policy_big_title {
font-size: 1.85rem;
}
@media (max-width: 768px) {
.policy_big_title {
font-size: 1.7rem;
margin: 15px 0;
}
}
.page_sections {
padding: 60px 0 80px;
}
@media (max-width: 768px) {
.page_sections {
padding: 25px 0 40px;
}
}
.page_sections__gray {
background-color: #f0f0f0;
}
.page_sections__white {
background-color: #fff;
}
.page_sections__lavender {
background-color: #f0fdff;
}
@media (min-width: 768px) {
.type02_inner {
display: inline-flex;
flex-wrap: wrap;
align-items: flex-start;
align-content: flex-start;
}
}
.policy_box {
position: relative;
box-sizing: border-box;
background-color: #fff;
border-radius: 5px;
}
@media (min-width: 768px) {
.policy_box {
padding: 35px;
width: 48%;
min-height: 290px;
margin-top: 35px;
}
.policy_box:nth-child(odd) {
margin-right: 4%;
}
}
@media (max-width: 768px) {
.policy_box {
padding: 23px;
margin-top: 25px;
}
}
.policy_box .policy_num {
position: absolute;
font-family: "Libre Baskerville", serif;
font-size: 7rem;
font-weight: 700;
color: #ffe7ef;
top: -20px;
left: 10px;
}
.policy_box h3 {
padding-left: 50px;
margin-bottom: 22px;
position: relative;
z-index: 2;
}
@media (min-width: 768px) {
.section_type03 {
display: inline-flex;
flex-wrap: wrap;
align-items: flex-start;
align-content: flex-start;
}
}
@media (min-width: 768px) {
.section_type03 .type03_title {
width: 16%;
}
}
.section_type03 .type03_title .section_title_en {
font-family: "Libre Baskerville", serif;
font-size: 3rem;
font-weight: 700;
color: #ae9cde;
}
@media (min-width: 768px) {
.section_type03 .type03_middle {
width: 33%;
}
}
.section_type03 .type03_inner {
position: relative;
}
@media (min-width: 768px) {
.section_type03 .type03_inner {
width: 45%;
margin-left: 6%;
}
}
.section_type03 .type03_inner::before {
position: absolute;
top: 25px;
left: -80px;
content: "";
display: block;
width: 60px;
height: 1px;
background-color: #181818;
}
@media (max-width: 768px) {
.section_type03 .type03_inner::before {
width: 33px;
transform: translateY(0) rotate(90deg);
top: -28px;
left: 45.5%;
margin: 0 auto;
}
}
.section_type03 .type03_inner h3 {
font-size: 1.7rem;
margin-bottom: 20px;
}
@media (max-width: 768px) {
.section_type03 .type03_inner h3 {
text-align: center;
}
}
@media (max-width: 768px) {
.section_type03 .type03_inner .yakushoku {
color: #888;
text-align: center;
font-size: 1.2rem;
margin-top: 25px;
}
}
.lv_borderbox {
border: 5px #f2ebff solid;
padding: 25px 35px 21px;
background-color: #fff;
box-sizing: border-box;
position: relative;
}
.lv_borderbox .box-title {
position: absolute;
left: 25px;
top: -18px;
background-color: #fff;
display: inline-block;
padding: 0 20px;
font-size: 1.6rem;
color: #ae9cde;
}
.shikaku {
margin-top: 30px;
}
.menu-item {
margin: 101px 0 108px;
}
@media (max-width: 768px) {
.menu-item {
margin: 207px 0 0;
}
}
.menu-article {
position: relative;
background: #fff;
padding: 68px 15px 33px;
}
@media (max-width: 768px) {
.menu-article {
min-height: auto;
padding: 14px 19px;
}
}
.menu-article-number {
position: absolute;
top: -2px;
right: 24px;
font-family: "Libre Baskerville", serif;
font-size: 8rem;
font-weight: 700;
color: #f3f3f3;
}
@media (max-width: 768px) {
.menu-article-number {
display: none;
}
}
.menu-top {
position: relative;
}
@media (min-width: 768px) {
.menu-top {
display: flex;
align-items: flex-start;
}
}
@media (max-width: 768px) {
.menu-top {
display: block;
}
}
.menu-media {
position: relative;
width: 46%;
}
@media (min-width: 768px) {
.menu-media {
margin-top: -109px;
}
}
@media (max-width: 768px) {
.menu-media {
width: 100%;
}
}
.menu-media-inner {
width: 440px;
height: 441px;
display: block;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
position: relative;
top: 0;
right: 0;
box-shadow: 5px 7px 12px -3px rgba(25, 25, 25, 0.2);
}
@media (max-width: 768px) {
.menu-media-inner {
position: relative;
top: 0;
left: 0;
width: 99%;
height: auto;
margin: -186px auto 20px;
padding-top: 99%;
}
}
.menu-media-inner img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
}
.menu-body {
width: 44%;
margin-left: 63px;
}
@media (max-width: 768px) {
.menu-body {
width: 100%;
margin: 28px 0 25px;
}
}
.menu-title {
position: relative;
font-size: 21px;
font-weight: 700;
letter-spacing: 0.04em;
}
@media (max-width: 768px) {
.menu-title {
font-size: 18px;
text-align: center;
}
}
.menu-title::after {
content: "";
display: block;
width: 110px;
height: 1px;
border-top: 1px solid #181818;
position: absolute;
top: 17px;
transform: translateY(-48%);
left: -129px;
}
@media (max-width: 768px) {
.menu-title::after {
width: 33px;
transform: translateY(0) rotate(90deg);
top: -28px;
left: 45.5%;
margin: 0 auto;
}
}
.menu-description {
font-size: 14px;
color: #181818;
letter-spacing: 0.079em;
line-height: 2;
margin-top: 12px;
font-weight: 300;
}
@media (max-width: 768px) {
.menu-description {
font-size: 14px;
letter-spacing: 0.056em;
margin-top: 14px;
}
}
.office-block-service-contents {
min-height: 0;
margin: 24px 0 18px;
}
@media (max-width: 768px) {
.office-block-service-contents {
width: 100%;
min-height: 0;
margin: 20px 0 25px;
}
}
.office-block-item {
color: #181818;
margin-bottom: 7px;
}
@media (min-width: 768px) {
.office-block-item {
display: flex;
align-items: flex-start;
}
}
@media (max-width: 768px) {
.office-block-item {
margin-bottom: 12px;
}
}
.office-block-item-inner {
margin: 5px 0;
}
.office-block-category {
width: 22.5%;
border: 1px solid #181818;
font-size: 10px;
font-weight: 700;
color: #181818;
line-height: 1.6;
text-align: center;
padding: 5px;
box-sizing: border-box;
}
@media (max-width: 768px) {
.office-block-category {
width: 100%;
padding: 5px 3px;
text-align: center;
display: block;
margin-bottom: 6px;
}
}
@media (min-width: 768px) {
.office-block-category-contents {
width: 23.4%;
}
}
.office-block-list-inner {
list-style: none;
}
@media (min-width: 768px) {
.office-block-list-inner {
width: 77.5%;
padding-left: 23px;
}
}
@media (max-width: 768px) {
.office-block-list-inner {
width: 100%;
}
}
.office-block-list-inner-contents {
font-size: 1.3rem;
}
@media (min-width: 768px) {
.office-block-list-inner-contents {
padding-left: 20px;
margin-top: -3px;
}
}
.office-block-divider {
width: 100%;
height: 1px;
border-top: 1px solid #ddd;
margin: 10px auto 25px;
}
.office-block-article {
position: relative;
}
.office-block-article-link {
display: block;
color: #333;
}
.office-block-article-content, .office-block-article-media {
display: inline-block;
vertical-align: middle;
}
.office-block-article-media {
position: relative;
width: 120px;
height: 80px;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
}
.history-card-title::before, .office-block-article-media::after {
content: "";
height: 100%;
background: #181818;
display: block;
position: absolute;
top: 0;
left: 0;
}
.office-block-article-media::after {
opacity: 0;
transition: opacity 0.25s ease;
width: 100%;
}
.office-block-article-content {
width: 275px;
padding-left: 10px;
margin-top: -3px;
}
.office-block-article-content-production {
width: 73%;
padding-left: 9px;
}
.office-block-article-title {
font-size: 14px;
font-weight: 200;
letter-spacing: 0.06em;
line-height: 1.6;
margin-bottom: 4px;
}
.office-block-article-date {
font-size: 11px;
letter-spacing: 0.06em;
padding-left: 2px;
}
.menu-price-contents {
margin: 30px auto 0;
}
@media (min-width: 768px) {
.menu-price-contents {
padding: 20px 35px;
width: 88%;
border: 10px solid #ffecec;
}
}
.menu-price-contents h3 {
font-weight: 700;
margin-bottom: 10px;
color: #999;
}
.info-table {
width: 100%;
border-collapse: collapse;
}
.info-table tr {
position: relative;
}
@media (min-width: 768px) {
.info-table tr {
background: url(//siran.jp/wp-content/themes/siran/assets/images/common/dot.gif) 0 19px repeat-x;
}
}
@media (max-width: 768px) {
.info-table tr {
display: block;
padding-left: 15px;
padding-bottom: 5px;
margin-bottom: 15px;
background-color: #f3f3f3;
}
.info-table tr::before {
display: inline-block;
content: "";
background-color: #ae9cde;
width: 3px;
height: 100%;
position: absolute;
left: 0;
top: 0;
}
}
.info-table tr th {
text-align: left;
font-weight: normal;
}
@media (min-width: 768px) {
.info-table tr th {
width: 70%;
}
.info-table tr th span {
display: inline-block;
background-color: #fff;
padding: 5px 10px;
}
.info-table tr th span.small-text {
font-size: 1.2rem;
padding: 0;
color: #666;
}
}
@media (max-width: 768px) {
.info-table tr th {
display: block;
width: 100%;
font-size: 1.4rem;
padding-top: 5px;
}
}
.info-table tr td {
font-weight: bold;
vertical-align: top;
font-family: "Libre Baskerville", "Noto Sans JP", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
text-align: right;
}
@media (max-width: 768px) {
.info-table tr td {
background: url(//siran.jp/wp-content/themes/siran/assets/images/common/dot.gif) 0 12px repeat-x;
}
}
.info-table tr td span {
display: inline-block;
background-color: #fff;
}
@media (min-width: 768px) {
.info-table tr td span {
padding: 5px 10px 5px 20px;
}
}
@media (max-width: 768px) {
.info-table tr td span {
background-color: #f3f3f3;
padding-left: 10px;
}
}
@media (max-width: 768px) {
.info-table tr td {
display: block;
width: 100%;
font-size: 1.4rem;
}
}
.menu-plus dt {
font-size: 1.4rem;
margin-bottom: 5px;
font-weight: bold;
}
.menu-plus dt::before {
background-color: #ae9cde;
width: 11px;
height: 11px;
content: "";
display: inline-block;
margin-right: 5px;
}
.menu-plus dd {
font-size: 1.3rem;
}
.access_flow {
width: 100%;
}
@media (min-width: 768px) {
.access_flow {
display: inline-flex;
flex-wrap: wrap;
align-items: flex-start;
align-content: flex-start;
}
}
.access_flow .access_box {
margin-bottom: 30px;
}
@media (min-width: 768px) {
.access_flow .access_box {
width: 48%;
}
.access_flow .access_box:nth-child(odd) {
margin-right: 4%;
}
}
.access_flow .access_box .caption {
font-size: 1.4rem;
margin-top: 5px;
}
.gmap {
width: 100%;
}
@media (max-width: 768px) {
.gmap {
margin-top: 30px;
}
}
.gmap iframe {
max-width: 100%;
}
@media (max-width: 768px) {
.gmap iframe {
height: 320px;
}
}
.flow {
width: 100%;
overflow: hidden;
padding-top: 30px;
}
.flow-container {
position: relative;
}
.flow-container.has-arrow {
margin-bottom: 80px;
}
.flow-container.has-arrow::before {
content: "";
position: absolute;
background: url(//siran.jp/wp-content/themes/siran/assets/images/page/arrow-btm.png) no-repeat center;
background-size: contain;
width: 15px;
height: 20px;
bottom: -45px;
left: 50%;
margin-left: -10px;
}
.flow-left-space {
position: relative;
opacity: 0;
left: -20px;
}
@media (min-width: 768px) {
.flow-left-space {
margin-left: 24%;
width: 76%;
}
}
.flow-left-space.moved {
-webkit-animation: fade-leftin 0.8s cubic-bezier(0.445, 0.05, 0.55, 0.95) forwards;
animation: fade-leftin 0.8s cubic-bezier(0.445, 0.05, 0.55, 0.95) forwards;
}
.flow-right-space {
position: relative;
opacity: 0;
right: -20px;
}
@media (min-width: 768px) {
.flow-right-space {
margin-right: 24%;
width: 76%;
}
}
.flow-right-space.moved {
-webkit-animation: fade-rightin 0.8s cubic-bezier(0.445, 0.05, 0.55, 0.95) forwards;
animation: fade-rightin 0.8s cubic-bezier(0.445, 0.05, 0.55, 0.95) forwards;
}
.flow-wrap {
padding: 55px 50px 40px;
background-color: #fff;
position: relative;
}
@media (max-width: 768px) {
.flow-wrap {
padding: 56px 20px 20px;
}
}
.flow-wrap dl dt {
margin-bottom: 10px;
font-weight: 700;
font-size: 1.8rem;
}
.flow-wrap dl dd {
font-size: 1.4rem;
}
@media (min-width: 768px) {
.flow-wrap .has-image dl {
padding-left: 45%;
}
}
.flow-number {
position: absolute;
padding: 0 5px;
border-bottom: 3px solid #3fc7f8;
}
@media (min-width: 768px) {
.flow-number.num-left {
left: -40px;
top: -20px;
}
}
@media (max-width: 768px) {
.flow-number.num-left {
left: -5px;
top: -15px;
}
}
@media (min-width: 768px) {
.flow-number.num-right {
right: -40px;
top: -20px;
}
}
@media (max-width: 768px) {
.flow-number.num-right {
left: -5px;
top: -15px;
}
}
.flow-number h4 {
margin-bottom: 5px;
font-family: "Libre Baskerville", serif;
font-size: 2.4rem;
font-weight: 700;
}
.flow-number h4 span {
letter-spacing: 0.1rem;
font-size: 1.6rem;
}
@media (min-width: 768px) {
.flow-img {
max-width: 40%;
float: left;
}
}
@media (max-width: 768px) {
.flow-img {
margin-bottom: 15px;
}
}
@media (min-width: 768px) {
.display-flex {
display: flex;
justify-content: space-between;
align-items: center;
}
}
@media (max-width: 768px) {
.display-flex {
text-align: center;
}
}
@media (min-width: 768px) {
.display-flex .half-button {
width: 45%;
}
}
@media (max-width: 768px) {
.display-flex .half-button {
margin-top: 5px;
}
}
@-webkit-keyframes fade-leftin {
0% {
left: -20px;
opacity: 0;
}
100% {
left: 0;
opacity: 1;
}
}
@keyframes fade-leftin {
0% {
left: -20px;
opacity: 0;
}
100% {
left: 0;
opacity: 1;
}
}
@-webkit-keyframes fade-rightin {
0% {
right: -20px;
opacity: 0;
}
100% {
right: 0;
opacity: 1;
}
}
@keyframes fade-rightin {
0% {
right: -20px;
opacity: 0;
}
100% {
right: 0;
opacity: 1;
}
}
.faq-wrap {
padding: 30px 50px;
height: 100%;
background-color: #fff;
margin-bottom: 30px;
box-sizing: border-box;
opacity: 0;
position: relative;
width: 100%;
}
@media (max-width: 768px) {
.faq-wrap {
padding: 20px 8%;
}
}
.faq-wrap.moved {
-webkit-animation: fadein 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
animation: fadein 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}
.faq-wrap dl dt {
font-weight: 700;
position: relative;
font-size: 1.6rem;
margin-bottom: 20px;
padding-left: 40px;
}
@media (max-width: 768px) {
.faq-wrap dl dt {
margin-bottom: 15px;
}
}
.faq-wrap dl dt::before {
content: "Q.";
position: absolute;
font-family: "Libre Baskerville", serif;
font-size: 1.8rem;
font-weight: 700;
color: #ae9cde;
left: 0;
top: -3px;
}
.faq-wrap dl dd {
margin-bottom: 0;
}
@media (max-width: 768px) {
.faq-wrap dl dd {
font-size: 1.4rem;
}
}
.title1 {
font-size: 2.4rem;
color: #fff;
margin-bottom: 30px;
font-weight: 900;
padding: 14px;
line-height: 1.4;
background-color: #a0c2d2;
border-radius: 4px;
}
@media (max-width: 768px) {
.title1 {
font-size: 2rem;
margin: 20px 0 10px;
}
}
.title2 {
font-size: 2.3rem;
color: #00479d;
font-weight: 900 !important;
margin-bottom: 24px;
border-bottom: 2px solid #00479d;
line-height: 1.5;
padding-bottom: 1rem;
}
@media (max-width: 768px) {
.title2 {
font-size: 2.1rem;
margin: 30px 0 12px;
}
}
.title3 {
border-bottom: solid 1px #555;
border-top: solid 1px #555;
padding: 13px;
margin: 15px 0;
}
@media (max-width: 768px) {
.title3 {
padding: 10px;
}
}
.title4 {
font-size: 1.8rem;
color: #666;
position: relative;
padding-left: 16px;
margin-bottom: 15px;
}
@media (max-width: 768px) {
.title4 {
font-size: 1.7rem;
margin-bottom: 10px;
}
}
.title4::before {
background: #3875a1;
width: 5px;
height: 24px;
display: block;
content: "";
margin-right: 6px;
position: absolute;
left: 0;
top: 5px;
}
.title5 {
font-size: 1.7rem;
background-color: #eee;
padding: 10px 20px;
position: relative;
margin-bottom: 15px;
}
@media (max-width: 768px) {
.title5 {
font-size: 1.6rem;
margin-bottom: 10px;
}
}
.title5::before {
width: 5px;
height: 100%;
position: absolute;
left: 0;
top: 0;
background-color: #07afbf;
content: "";
display: block;
}
.st_half {
width: 100%;
}
@media (min-width: 768px) {
.st_half {
display: inline-flex;
flex-wrap: wrap;
align-items: flex-start;
align-content: flex-start;
}
}
.st_half .st_one {
box-sizing: border-box;
}
@media (min-width: 768px) {
.st_half .st_one {
width: 68%;
padding-right: 8%;
}
}
@media (min-width: 768px) {
.st_half .st_imgs {
width: 32%;
}
}
@media (max-width: 768px) {
.st_half .st_imgs {
width: 100%;
margin-top: 30px;
display: flex;
justify-content: space-between;
align-items: center;
}
.st_half .st_imgs img {
max-width: 49%;
}
}
.title-box {
width: 100%;
}
.title-box h4 {
background-color: #00479d;
color: #fff;
padding: 8px 25px;
border-radius: 5px 5px 0 0;
}
.title-box .inner {
border: 1px #ddd solid;
padding: 25px 30px;
border-radius: 0 0 5px 5px;
}
@media (max-width: 768px) {
.title-box .inner {
padding: 20px;
}
}
@media (min-width: 768px) {
.srotas03 {
display: block;
margin: 20px auto 0;
max-width: 200px;
}
}
.font-l {
font-size: 3rem;
}
@media (min-width: 768px) {
.three-flex {
display: inline-flex;
flex-wrap: wrap;
align-items: flex-start;
align-content: flex-start;
}
}
@media (min-width: 768px) {
.three-flex .dosha-box {
width: 33.3333%;
}
}
.three-flex .dosha-box:nth-of-type(1) {
background-color: #fff2ec;
}
.three-flex .dosha-box:nth-of-type(1) h4 {
background-color: #eb8841;
}
.three-flex .dosha-box:nth-of-type(2) {
background-color: #cefaee;
}
.three-flex .dosha-box:nth-of-type(2) h4 {
background-color: #31d18e;
}
.three-flex .dosha-box:nth-of-type(3) {
background-color: #f4d7ff;
}
.three-flex .dosha-box:nth-of-type(3) h4 {
background-color: #a653c3;
}
.three-flex .dosha-box h4 {
padding: 8px 25px;
color: #fff;
font-family: 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
font-size: 2rem;
text-align: center;
}
.three-flex .dosha-box-img {
background-color: #fff;
position: relative;
width: 200px;
height: 200px;
border-radius: 50%;
margin: 25px auto;
}
@media (max-width: 768px) {
.three-flex .dosha-box-img {
width: 120px;
height: 120px;
margin: 25px auto 15px;
}
}
.three-flex .dosha-box-img img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
height: 80%;
width: auto;
}
.three-flex .dosha-box .inner {
padding: 30px 10%;
}
@media (min-width: 768px) {
.three-flex .dosha-box .inner {
height: 347px;
}
}
@media (max-width: 768px) {
.three-flex .dosha-box .inner {
padding: 10px 5% 25px;
}
}
.three-flex .dosha-box-subs {
font-size: 1.8rem;
font-weight: bold;
margin-bottom: 20px;
}
@media (min-width: 768px) {
.interview {
font-size: 110%;
}
}
.talk_g {
color: #00479d;
}
.talk_g span {
font-weight: bold;
}
.talk_b {
padding: 30px 0 50px;
}
@media (max-width: 768px) {
.talk_b {
padding: 20px 0 30px;
}
}
.talk_b span {
color: #509098;
font-weight: bold;
}
@media (min-width: 768px) {
.float-img-l {
width: 40%;
float: left;
}
}
@media (max-width: 768px) {
.float-img-l {
margin-bottom: 30px;
}
}
@media (min-width: 768px) {
.float-img-r {
float: right;
}
.float-img-r.int_02 {
width: 45%;
}
}
@media (min-width: 768px) {
.float-img-r.int_03 {
width: 35%;
}
}
@media (max-width: 768px) {
.float-img-r.int_03 {
margin-top: 20px;
}
}
@media (max-width: 768px) {
.float-img-r {
margin-bottom: 30px;
}
}
@media (min-width: 768px) {
.float-text-r {
width: 55%;
float: right;
}
}
@media (min-width: 768px) {
.float-text-l {
width: 50%;
float: left;
}
.float-text-l.int_03 {
width: 60%;
}
}
.entry-date {
font-family: "Libre Baskerville", serif;
font-size: 1.4rem;
font-weight: 700;
}
@media (max-width: 768px) {
.entry-date {
font-size: 1.2rem;
margin-top: -2px;
}
}
@media (min-width: 768px) {
.entries-block {
display: inline-flex;
flex-wrap: wrap;
align-items: flex-start;
align-content: flex-start;
width: 100%;
margin: 0 auto;
}
}
.entry {
box-sizing: border-box;
overflow: hidden;
opacity: 0;
position: relative;
}
@media (max-width: 768px) {
.entry {
display: flex;
align-items: flex-start;
justify-content: space-between;
width: 100%;
}
}
.entry.moved {
transform: translateY(100px);
-webkit-animation: slideup 0.5s ease-out forwards;
animation: slideup 0.5s ease-out forwards;
-webkit-animation-delay: 0s;
animation-delay: 0s;
}
.entry.moved:nth-child(1) {
-webkit-animation-delay: 0s;
animation-delay: 0s;
}
.entry.moved:nth-child(2) {
-webkit-animation-delay: 0.1s;
animation-delay: 0.1s;
}
.entry.moved:nth-child(3) {
-webkit-animation-delay: 0.2s;
animation-delay: 0.2s;
}
.entry.moved:nth-child(4) {
-webkit-animation-delay: 0.3s;
animation-delay: 0.3s;
}
@media (min-width: 768px) {
.entry {
width: 25%;
padding: 0 1%;
}
}
@media (max-width: 768px) {
.entry {
margin-bottom: 15px;
width: 100%;
padding-bottom: 15px;
border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}
}
.entry a {
display: block;
}
.entry-img {
width: 100%;
position: relative;
margin-bottom: 12px;
overflow: hidden;
}
@media (min-width: 768px) {
.entry-img {
aspect-ratio: 1/1;
}
}
@media (max-width: 768px) {
.entry-img {
width: 90px;
height: 90px;
background-color: #eee;
}
}
.entry-img img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
width: auto;
height: auto;
}
@-webkit-keyframes slideup {
0% {
opacity: 0;
transform: translateY(100px);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
@keyframes slideup {
0% {
opacity: 0;
transform: translateY(100px);
}
100% {
opacity: 1;
transform: translateY(0);
}
}
.entry-body {
display: block;
margin-top: 10px;
}
@media (max-width: 768px) {
.entry-body {
margin-top: 0;
width: calc(100% - 110px);
}
}
.entry-title {
text-decoration: underline;
}
@media (min-width: 768px) {
.entry-title {
font-size: 15px;
line-height: 1.5;
}
}
@media (max-width: 768px) {
.entry-title {
margin-top: 2px;
display: block;
font-size: 13px;
line-height: 1.71;
}
}
.entry-drop {
font-size: 13px;
color: #777;
max-height: 0;
overflow: hidden;
transition: all 0.5s ease-in-out;
}
.entry-drop.active {
max-height: 500px;
}
@media (min-width: 768px) {
.entry-drop {
padding: 10px 0 0;
font-size: 13px;
}
}
@media (max-width: 768px) {
.entry-drop {
padding: 10px 5px 0;
}
.entry-drop.active {
max-height: 500px;
}
}
.float_link {
display: block;
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: 1;
}
.breadcrumbs {
padding: 20px 0;
font-size: 1.2rem;
}
@media (max-width: 768px) {
.breadcrumbs {
padding: 15px 0;
}
}
@media (min-width: 1200px) {
.leftColumn {
width: 780px;
float: left;
}
}
@media (max-width: 1200px) {
.leftColumn {
width: 100%;
}
}
.article_box {
width: 100%;
padding: 30px 0;
border-bottom: 1px dashed #e1e1e1;
}
@media (max-width: 768px) {
.article_box {
padding: 18px 0;
}
}
.i_catch {
width: 240px;
height: 160px;
float: left;
position: relative;
overflow: hidden;
border: 1px #DDD solid;
}
.i_catch img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
}
@media (max-width: 768px) {
.i_catch {
width: 90px;
height: 90px;
}
}
@media (min-width: 768px) {
.post-meta {
padding-left: 280px;
min-height: 160px;
}
}
@media (max-width: 768px) {
.post-meta {
padding-left: 112px;
line-height: 1.4;
}
}
.post-meta .post_date {
font-family: "Libre Baskerville", serif;
font-size: 1.6rem;
font-weight: 700;
margin-bottom: 5px;
}
.post-meta .title {
font-size: 1.6rem;
line-height: 1.4;
}
@media (max-width: 768px) {
.post-meta .title {
font-size: 14px;
}
}
.post-meta .post_excerpt {
font-size: 1.3rem;
color: #666;
margin-top: 8px;
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
.post-meta .tags {
margin-top: 5px;
}
.post-meta .tags a {
background-color: #CCC;
font-size: 1.2rem;
color: #fff;
display: inline-block;
padding: 0 5px;
}
@media (min-width: 1200px) {
.rightBlogs {
width: 270px;
float: right;
}
}
@media (max-width: 1200px) {
.rightBlogs {
margin-top: 50px;
padding-bottom: 50px;
}
}
.sidebar_box {
border: 1px solid #e1e1e1;
margin-top: 20px;
}
.widget-pickup ul {
margin: 0;
padding: 15px;
list-style: none;
background: #fff;
}
.widget-pickup ul li {
margin-top: 10px;
padding-top: 10px;
border-top: 1px dotted #a0a0a0;
}
.widget-pickup ul li:first-child {
margin-top: 0;
padding-top: 0;
border-top: none;
}
.widget-pickup .thumbnail {
float: left;
width: 80px;
height: 80px;
position: relative;
margin: 0;
}
.widget-pickup .thumbnail img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
}
.widget-pickup .parts-meta {
padding-left: 95px;
}
.widget-pickup h3.slide-title {
font-size: 1.3rem;
line-height: 1.4;
}
.widget-pickup .date_number {
margin-bottom: 2px;
color: #777;
font-family: "Libre Baskerville", serif;
font-size: 1.2rem;
font-weight: 700;
}
.article_date {
font-weight: 700;
font-size: 18px;
color: #767676;
}
.article_right {
display: block;
position: relative;
line-height: 1.5;
}
@media (min-width: 768px) {
.article_right {
float: left;
width: 480px;
min-height: 160px;
margin-left: 30px;
}
}
@media (max-width: 768px) {
.article_right {
width: auto;
padding-left: 105px;
min-height: 60px;
}
}
.article_right h2 a {
font-size: 16px;
font-weight: bold;
color: #434343;
}
.article_right h2 a:hover {
color: #2ea7e0;
}
@media (max-width: 768px) {
.article_right h2 a {
font-size: 16px;
}
}
.article_right .blog_excerpt {
color: #545454;
margin-top: 10px;
}
@media (max-width: 768px) {
.article_right .blog_excerpt {
font-size: 12px;
margin-top: 5px;
}
}
@media (min-width: 768px) {
.article_right .arc_tags {
position: absolute;
left: 0;
bottom: 0;
}
}
@media (max-width: 768px) {
.article_right .arc_tags {
margin-top: 4px;
}
}
@media (min-width: 768px) {
.article_right .article_date {
position: absolute;
right: 0;
bottom: 0;
}
}
@media (max-width: 768px) {
.article_right .article_date {
display: block;
font-size: 13px;
margin-top: 3px;
}
}
.article_right__disco {
float: none;
width: auto;
padding-left: 190px;
margin-left: 0;
box-sizing: border-box;
}
@media (max-width: 768px) {
.article_right__disco {
width: auto;
padding-left: 105px;
min-height: 90px;
}
}
@media (min-width: 768px) {
.article_right__disco .article_date {
position: inherit;
right: auto;
bottom: auto;
font-size: 15px;
color: #08aec4;
}
}
@media (max-width: 768px) {
.article_right__disco .article_date {
display: block;
font-size: 13px;
margin-top: 3px;
}
}
.post-categories li {
float: left;
}
.article_box .arc_tags span, .article_top .arc_tags span, .post-categories li a {
display: inline-block;
padding: 2px 6px;
background-color: #858f8f;
color: #FFF;
font-size: 12px;
margin-right: 3px;
border-radius: 4px;
}
.widget-title {
background-color: #F3F3F3;
font-size: 16px;
padding: 10px;
font-weight: bold;
margin-top: 0;
}
.widget:not(:first-child) {
margin-top: 20px;
}
.side_list li a {
padding: 8px 10px 8px 20px;
display: block;
background: url(//siran.jp/wp-content/themes/siran/assets/images/common/arrow2.png) no-repeat 5px 15px;
background-size: 10px 10px;
border-bottom: 1px solid #e1e1e1;
}
.side_list li:last-child a {
border-bottom: 0;
} .single_title {
font-size: 2.4rem;
border-bottom: 1px #333 solid;
padding-bottom: 15px;
margin-bottom: 30px;
line-height: 1.5;
}
@media (max-width: 768px) {
.single_title {
font-size: 1.6rem;
}
}
.post_data {
margin-bottom: 30px;
}
.post_data p {
display: inline-block;
background-color: #eee;
padding: 0 15px;
border-radius: 20px;
font-size: 13px;
margin-right: 3px;
}
.post_data p:last-child {
margin-right: 0;
}
.post_data p a {
color: #777;
}
.post_data p a:hover {
color: #27b3bb;
}
@media (min-width: 768px) {
.single_content {
font-size: 112%;
}
}
.single_content div {
max-width: 100% !important;
}
.single_content p {
padding-bottom: 2rem;
padding-top: 0;
margin-top: 0;
margin-bottom: 0;
}
.single_content p:empty {
display: none;
}
.single_content h1 {
font-size: 2.4rem;
margin: 56px 0 24px;
}
@media (max-width: 768px) {
.single_content h1 {
font-size: 2rem;
margin: 40px 0 24px;
}
}
.single_content h2 {
font-size: 2.2rem;
color: #444;
font-weight: 700 !important;
margin: 60px 0 24px;
border-bottom: 2px solid #bce2e3;
line-height: 1.5;
padding-bottom: 1rem;
}
@media (max-width: 768px) {
.single_content h2 {
font-size: 2rem;
margin: 30px 0 12px;
}
}
.single_content h3 {
font-size: 2rem;
color: #444;
margin: 40px 0 16px;
font-weight: 700 !important;
padding: 6px 18px;
background-color: #efeef3;
border-radius: 4px;
}
@media (max-width: 768px) {
.single_content h3 {
font-size: 1.8rem;
margin: 20px 0 10px;
}
}
.single_content h4 {
border-bottom: solid 1px #aaa;
border-top: solid 1px #aaa;
padding: 13px;
margin: 15px 0;
}
@media (max-width: 768px) {
.single_content h4 {
padding: 10px;
}
}
.single_content h5 {
font-size: 1.8rem;
color: #666;
position: relative;
padding-left: 16px;
margin-bottom: 15px;
}
@media (max-width: 768px) {
.single_content h5 {
font-size: 1.7rem;
margin-bottom: 10px;
}
}
.single_content h5::before {
background: #3875a1;
width: 5px;
height: 24px;
display: block;
content: "";
margin-right: 6px;
position: absolute;
left: 0;
top: 5px;
}
.single_content h6 {
font-size: 1.7rem;
background-color: #eee;
padding: 10px 20px;
position: relative;
margin-bottom: 15px;
}
@media (max-width: 768px) {
.single_content h6 {
font-size: 1.6rem;
margin-bottom: 10px;
}
}
.single_content h6::before {
width: 5px;
height: 100%;
position: absolute;
left: 0;
top: 0;
background-color: #07afbf;
content: "";
display: block;
}
.single_content table {
border-collapse: collapse;
border-spacing: 0;
margin: 15px 0;
width: 100%;
}
.single_content table th, .single_content table td {
vertical-align: middle;
padding: 15px 10px;
border: 1px solid #ddd;
margin: 0;
}
.single_content table th {
text-align: center;
background: #eee;
font-weight: bold;
}
.single_content blockquote {
position: relative;
box-sizing: border-box;
padding: 45px 20px 45px 30px;
margin: 0 0 30px;
font-weight: 400;
color: #444;
background-color: #f3f3f3;
border: 1px #ddd solid;
}
@media (max-width: 768px) {
.single_content blockquote {
padding: 20px 5%;
}
}
.single_content pre {
padding: 20px;
margin: 20px;
background: #eee;
border-radius: 5px;
font-size: 1.5rem;
white-space: pre-line;
}
.single_content code {
word-wrap: break-word;
font-size: 1.5rem;
}
.single_content .word-set {
display: inline-table;
position: relative;
vertical-align: baseline;
white-space: initial;
}
.single_content img {
max-width: 100% !important;
height: auto;
margin-bottom: 40px;
border-radius: 8px;
border: 1px #eee solid;
overflow: hidden;
}
@media (max-width: 768px) {
.single_content img {
margin-bottom: 24px;
}
}
.single_bottom {
margin-top: 50px;
border-top: 1px #ddd solid;
padding-top: 20px;
}
@media (max-width: 768px) {
.single_bottom {
margin-top: 25px;
padding-top: 15px;
}
}
.cat_tag a, .cat_tag span {
background-color: #bbb;
display: inline-block;
margin-right: 2px;
font-size: 1.2rem;
color: #fff;
padding: 1px 10px;
}
@media (max-width: 768px) {
.cat_tag a, .cat_tag span {
line-height: 1;
font-size: 1.1rem;
padding: 4px 8px;
}
}
#form_wrapper dl {
margin-bottom: 20px;
} .wp-pagenavi {
padding: 12px 5px;
background: #F3F3F3;
border-radius: 4px;
font-size: 100%;
text-align: center;
border: 1px #DDD solid;
margin-top: 30px;
}
.all_seminar .wp-pagenavi {
margin: 0 auto;
}
.wp-pagenavi span,
.wp-pagenavi a {
padding: 5px 7px !important;
border-radius: 3px;
}
.wp-pagenavi .page,
.wp-pagenavi .pages,
.wp-pagenavi .extend,
.wp-pagenavi .last,
.wp-pagenavi .nextpostslink,
.wp-pagenavi .previouspostslink,
.wp-pagenavi .first {
background: #FFF;
}
.wp-pagenavi .current {
background: #1eb0d6;
color: #FFF;
}
.counter-hierarchy {
border: 1px #ddd solid;
background-color: #f3f3f3;
padding: 20px 30px;
box-sizing: border-box;
}
@media (max-width: 768px) {
.counter-hierarchy {
padding: 13px;
}
}
.ez-toc-list li {
margin-left: 20px;
}
@media (max-width: 768px) {
.ez-toc-list li {
margin-left: 5px;
}
}
.ez-toc-title {
text-align: center !important;
font-size: 100%;
margin-bottom: 5px;
}
.post_thumb {
width: 100%;
margin-bottom: 15px;
position: relative;
}
@media (min-width: 768px) {
.post_thumb {
height: 180px;
}
.post_thumb img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
}
}
@media (max-width: 768px) {
.post_thumb {
margin-bottom: 10px;
}
}
.pop_posts {
margin-top: 50px;
}
.wpp-list {
width: 100%;
}
@media (min-width: 768px) {
.wpp-list {
display: inline-flex;
flex-wrap: wrap;
align-items: flex-start;
align-content: flex-start;
}
}
.wpp-list li {
margin-bottom: 0 !important;
}
@media (min-width: 768px) {
.wpp-list li {
width: 50%;
}
}
.wpp-list li a {
display: block;
padding: 15px 30px 15px 16px;
border-right: 1px solid #ddd;
border-bottom: 1px solid #ddd;
transition: all 0.3s ease 0s;
}
@media (max-width: 768px) {
.wpp-list li a {
border-left: 1px solid #ddd;
}
}
.wpp-list li a:hover {
background-color: #f3f3f3;
}
.wpp-list li a:hover .pop_thumb_img img {
transform: scale(1.1);
transition-duration: 0.3s;
}
@media (min-width: 768px) {
.wpp-list li:nth-child(2n+1) a {
border-left: 1px solid #ddd;
}
}
@media (min-width: 768px) {
.wpp-list li:nth-child(-n+2) a {
border-top: 1px solid #ddd;
}
}
@media (max-width: 768px) {
.wpp-list li:first-child a {
border-top: 1px solid #ddd;
}
}
.popular_title {
font-size: 1.8rem;
background-color: #eee;
padding: 10px 20px;
position: relative;
margin-bottom: 15px;
}
@media (max-width: 768px) {
.popular_title {
font-size: 1.6rem;
margin-bottom: 10px;
}
}
.popular_title::before {
width: 5px;
height: 100%;
position: absolute;
left: 0;
top: 0;
background-color: #07afbf;
content: "";
display: block;
}
.pop_thumb_img {
width: 120px;
height: 80px;
overflow: hidden;
position: relative;
float: left;
}
@media (max-width: 768px) {
.pop_thumb_img {
width: 90px;
height: 60px;
}
}
.pop_thumb_img img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
transition: all 0.3s ease 0s;
}
.pop_img_side {
margin-left: 140px;
min-height: 80px;
}
@media (max-width: 768px) {
.pop_img_side {
margin-left: 112px;
height: auto;
min-height: 72px;
}
}
.pop_img_side h3 {
font-size: 1.4rem;
color: #333;
line-height: 1.4;
display: -webkit-box;
overflow: hidden;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
.pop_img_side .pops_date {
font-family: "Libre Baskerville", serif;
font-size: 1.2rem;
font-weight: 400;
line-height: 1;
margin-top: 8px;
color: #666;
}
.alert {
box-sizing: border-box;
border: 1px #333 solid;
background-color: #fff;
padding: 30px 50px;
width: 90%;
max-width: 800px;
margin: 50px auto;
font-size: 1.8rem;
}
@media (max-width: 768px) {
.alert {
margin: 30px auto;
padding: 20px;
}
}
@media (max-width: 768px) {
.alert p {
font-size: 1.3rem;
}
}
.alert p.tit {
font-weight: bold;
}
.alert p.tit i {
color: #ae9cde;
margin-right: 5px;
}
.alert ul {
margin-top: 12px;
}
@media (max-width: 768px) {
.alert ul li {
font-size: 1.3rem;
line-height: 1.5;
}
.alert ul li:not(:last-child) {
margin-bottom: 5px;
}
}
@media (max-width: 768px) {
.alert h2 {
font-size: 4vw;
}
}
.check_item {
background-color: #fff0f9;
padding: 16px;
border-radius: 4px;
margin-top: 24px;
}
@media (min-width: 768px) {
.check_item {
width: 100%;
max-width: 800px;
margin: 40px auto 0;
}
}
.check_item .tit {
color: #f01c94;
font-weight: bold;
text-align: center;
cursor: pointer;
}
.check_item .tit i {
margin-left: 12px;
transition: all 0.3s ease;
}
.check_item .inner {
background-color: white;
padding: 24px;
border-radius: 4px;
font-size: 1.4rem;
margin-top: 16px;
display: none;
}
@media (min-width: 768px) {
.check_item .inner {
text-align: center;
}
}
.check_item.active .tit i {
transform: rotate(180deg);
}
.imgList {
margin-left: auto;
margin-right: auto;
width: 100%;
display: inline-flex;
flex-wrap: wrap;
align-items: flex-start;
align-content: flex-start;
}
.imgList li {
margin-bottom: 20px;
}
@media (min-width: 768px) {
.imgList li {
width: 32%;
margin-right: 2%;
}
.imgList li:nth-child(3n) {
margin-right: 0;
}
}
.imgList li .img {
margin-bottom: 8px;
}
.imgList li .img a {
display: block;
width: 100%;
position: relative;
overflow: hidden;
}
.imgList li .img a::before {
content: "";
display: block;
padding-top: 66.25%;
}
.imgList li .img a img {
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
transition: all 0.3s ease;
}
.imgList li .img a:hover img {
transform: scale(1.1);
}
.imgList li img {
width: 100%;
}
@media (max-width: 768px) {
.imgList li {
width: 49%;
}
.imgList li:nth-child(odd) {
margin-right: 2%;
}
}
@media (max-width: 768px) {
.imgList li {
width: 100%;
}
}
.caption {
text-align: center;
margin-top: 3px;
font-size: 1.3rem;
}
.imgList_2 {
margin-left: auto;
margin-right: auto;
width: 100%;
}
@media (min-width: 768px) {
.imgList_2 {
display: inline-flex;
flex-wrap: wrap;
align-items: flex-start;
align-content: flex-start;
}
}
@media (min-width: 768px) {
.imgList_2 li {
width: 49%;
}
.imgList_2 li:nth-child(odd) {
margin-right: 2%;
}
.imgList_2 li:nth-child(n+3) {
margin-top: 32px;
}
}
@media (max-width: 768px) {
.imgList_2 li {
margin-bottom: 20px;
}
}
 .ma5{margin:5px;}
.ma10{margin:10px;}
.ma15{margin:15px;}
.ma20{margin:20px;}
.ma25{margin:25px;}
.ma30{margin:30px;}
.mt5{margin-top:5px;}
.mt10{margin-top:10px;}
.mt15{margin-top:15px;}
.mt20{margin-top:20px;}
.mt25{margin-top:25px;}
.mt30{margin-top:30px;}
.mt40{margin-top:40px;}
.mt50{margin-top:50px;}
.mt70{margin-top:70px;}
.mt100{margin-top:100px;}
.mt200{margin-top:200px;}
.mr0{margin-right:0;}
.mr5{margin-right:5px;}
.mr10{margin-right:10px;}
.mr12{margin-right:12px;}
.mr15{margin-right:15px;}
.mr18{margin-right:18px;}
.mr20{margin-right:20px;}
.mr25{margin-right:25px;}
.mr30{margin-right:30px;}
.mr35{margin-right:35px;}
.mr40{margin-right:40px;}
.mr45{margin-right:45px;}
.mr50{margin-right:50px;}
.mb0{margin-bottom:0;}
.mb4{margin-bottom:4px;}
.mb5{margin-bottom:5px;}
.mb10{margin-bottom:10px;}
.mb15{margin-bottom:15px;}
.mb20{margin-bottom:20px;}
.mb25{margin-bottom:25px;}
.mb30{margin-bottom:30px;}
.mb35{margin-bottom:35px;}
.mb40{margin-bottom:40px;}
.mb50{margin-bottom:50px;}
.ml5{margin-left:5px;}
.ml10{margin-left:10px;}
.ml15{margin-left:15px;}
.ml20{margin-left:20px;}
.ml25{margin-left:25px;}
.ml30{margin-left:30px;}
.ml40{margin-left:40px;}
.ml50{margin-left:50px;}
.ht80{height:80px;}
.ht90{height:90px;}
.ht100{height:100px;}
.ht110{height:110px;}
.ht120{height:120px;}
.ht150{height:150px;}
.ht200{height:200px;}
.ht250{height:250px;}
.ht270{height:270px;}
.ht270{height:280px;}
.ht300{height:300px;}
.ht380{height:380px;}
.ht390{height:390px;}
.ht400{height:400px;}
.ht410{height:410px;}
.ht420{height:420px;}
.ht430{height:430px;}
.ht440{height:440px;}
.ht450{height:450px;}
.pd20{padding:20px;}
.pt0{padding-top:0;}
.pt10{padding-top:10px;}
.pt20{padding-top:20px;}
.pt30{padding-top:30px;}
.pb0{padding-bottom:0;}
.pb10{padding-bottom:10px;}
.pb20{padding-bottom:20px;}
.pb30{padding-bottom:30px;}
@media (max-width: 768px) {
.ma5{margin:3px;}
.ma10{margin:5px;}
.ma15{margin:8px;}
.ma20{margin:10px;}
.ma25{margin:13px;}
.ma30{margin:15px;}
.mt5{margin-top:3px;}
.mt10{margin-top:5px;}
.mt15{margin-top:8px;}
.mt20{margin-top:10px;}
.mt25{margin-top:13px;}
.mt30{margin-top:15px;}
.mt40{margin-top:20px;}
.mt50{margin-top:25px;}
.mt70{margin-top:35px;}
.mt100{margin-top:50px;}
.mt200{margin-top:100px;}
.mr0{margin-right:0;}
.mr5{margin-right:3px;}
.mr10{margin-right:5px;}
.mr12{margin-right:6px;}
.mr15{margin-right:8px;}
.mr20{margin-right:10px;}
.mr25{margin-right:13px;}
.mr30{margin-right:15px;}
.mr35{margin-right:18px;}
.mr40{margin-right:20px;}
.mr45{margin-right:23px;}
.mr50{margin-right:25px;}
.mb0{margin-bottom:0;}
.mb4{margin-bottom:2px;}
.mb5{margin-bottom:3px;}
.mb10{margin-bottom:5px;}
.mb15{margin-bottom:8px;}
.mb20{margin-bottom:10px;}
.mb25{margin-bottom:13px;}
.mb30{margin-bottom:15px;}
.mb35{margin-bottom:18px;}
.mb40{margin-bottom:20px;}
.mb50{margin-bottom:25px;}
.ml5{margin-left:3px;}
.ml10{margin-left:5px;}
.ml15{margin-left:8px;}
.ml20{margin-left:10px;}
.ml25{margin-left:13px;}
.ml30{margin-left:15px;}
.ml40{margin-left:20px;}
.ml50{margin-left:25px;}
}
.fl{float:left;}
.fr{float:right;}
.lh16 { line-height: 1.6; }
.lh17 { line-height: 1.7; }
.fs14{font-size:14px;}
.ac{text-align:center;}
.bd{font-weight:bold;}
.text-center{text-align: center;}
.text-right{text-align: right;}
.img-block {max-width: 100%;}
.mauto {margin-left: auto; margin-right: auto;} .text1 {
font-size: 16px;
color: #da4553;
font-weight: bold;
}
.text2 {
font-weight: bold;
color: #0049ab;
font-size: 1.8rem;
letter-spacing: 0.05em;
line-height: 1.55;
}
.text3 {
font-size: 1.2rem;
font-weight: bold;
color: #DC009E;
}
.text4 {
font-size: 15px;
color: #004879;
}
.font-s {
color: #777;
font-size: 1.3rem;
}