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


@font-face {
font-family: "YakuHanJP";
font-style: normal;
font-weight: 100;
font-display: swap;
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanJP/YakuHanJP-Thin.eot);
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanJP/YakuHanJP-Thin.woff2) format("woff2"), url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanJP/YakuHanJP-Thin.woff) format("woff");
unicode-range: U+3001-3002, U+3008-3011, U+3014-3015, U+30fb, U+ff01, U+ff08-ff09, U+ff1a-ff1b, U+ff1f, U+ff3b, U+ff3d, U+ff5b, U+ff5d;
}
@font-face {
font-family: "YakuHanJP";
font-style: normal;
font-weight: 300;
font-display: swap;
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanJP/YakuHanJP-Light.eot);
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanJP/YakuHanJP-Light.woff2) format("woff2"), url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanJP/YakuHanJP-Light.woff) format("woff");
unicode-range: U+3001-3002, U+3008-3011, U+3014-3015, U+30fb, U+ff01, U+ff08-ff09, U+ff1a-ff1b, U+ff1f, U+ff3b, U+ff3d, U+ff5b, U+ff5d;
}
@font-face {
font-family: "YakuHanJP";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanJP/YakuHanJP-Regular.eot);
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanJP/YakuHanJP-Regular.woff2) format("woff2"), url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanJP/YakuHanJP-Regular.woff) format("woff");
unicode-range: U+3001-3002, U+3008-3011, U+3014-3015, U+30fb, U+ff01, U+ff08-ff09, U+ff1a-ff1b, U+ff1f, U+ff3b, U+ff3d, U+ff5b, U+ff5d;
}
@font-face {
font-family: "YakuHanJP";
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanJP/YakuHanJP-Medium.eot);
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanJP/YakuHanJP-Medium.woff2) format("woff2"), url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanJP/YakuHanJP-Medium.woff) format("woff");
unicode-range: U+3001-3002, U+3008-3011, U+3014-3015, U+30fb, U+ff01, U+ff08-ff09, U+ff1a-ff1b, U+ff1f, U+ff3b, U+ff3d, U+ff5b, U+ff5d;
}
@font-face {
font-family: "YakuHanJP";
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanJP/YakuHanJP-Bold.eot);
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanJP/YakuHanJP-Bold.woff2) format("woff2"), url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanJP/YakuHanJP-Bold.woff) format("woff");
unicode-range: U+3001-3002, U+3008-3011, U+3014-3015, U+30fb, U+ff01, U+ff08-ff09, U+ff1a-ff1b, U+ff1f, U+ff3b, U+ff3d, U+ff5b, U+ff5d;
}
@font-face {
font-family: "YakuHanJP";
font-style: normal;
font-weight: 900;
font-display: swap;
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanJP/YakuHanJP-Black.eot);
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanJP/YakuHanJP-Black.woff2) format("woff2"), url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanJP/YakuHanJP-Black.woff) format("woff");
unicode-range: U+3001-3002, U+3008-3011, U+3014-3015, U+30fb, U+ff01, U+ff08-ff09, U+ff1a-ff1b, U+ff1f, U+ff3b, U+ff3d, U+ff5b, U+ff5d;
}
@font-face {
font-family: "YakuHanMP";
font-style: normal;
font-weight: 100;
font-display: swap;
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-ExtraLight.eot);
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-ExtraLight.woff2) format("woff2"), url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-ExtraLight.woff) format("woff");
unicode-range: U+3001-3002, U+300a-3011, U+3014-3015, U+30fb, U+ff01, U+ff08-ff09, U+ff1a-ff1b, U+ff1f, U+ff3b, U+ff3d, U+ff5b, U+ff5d;
}
@font-face {
font-family: "YakuHanMP";
font-style: normal;
font-weight: 200;
font-display: swap;
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-Light.eot);
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-Light.woff2) format("woff2"), url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-Light.woff) format("woff");
unicode-range: U+3001-3002, U+300a-3011, U+3014-3015, U+30fb, U+ff01, U+ff08-ff09, U+ff1a-ff1b, U+ff1f, U+ff3b, U+ff3d, U+ff5b, U+ff5d;
}
@font-face {
font-family: "YakuHanMP";
font-style: normal;
font-weight: 300;
font-display: swap;
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-Regular.eot);
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-Regular.woff2) format("woff2"), url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-Regular.woff) format("woff");
unicode-range: U+3001-3002, U+300a-3011, U+3014-3015, U+30fb, U+ff01, U+ff08-ff09, U+ff1a-ff1b, U+ff1f, U+ff3b, U+ff3d, U+ff5b, U+ff5d;
}
@font-face {
font-family: "YakuHanMP";
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-Medium.eot);
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-Medium.woff2) format("woff2"), url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-Medium.woff) format("woff");
unicode-range: U+3001-3002, U+300a-3011, U+3014-3015, U+30fb, U+ff01, U+ff08-ff09, U+ff1a-ff1b, U+ff1f, U+ff3b, U+ff3d, U+ff5b, U+ff5d;
}
@font-face {
font-family: "YakuHanMP";
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-SemiBold.eot);
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-SemiBold.woff2) format("woff2"), url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-SemiBold.woff) format("woff");
unicode-range: U+3001-3002, U+300a-3011, U+3014-3015, U+30fb, U+ff01, U+ff08-ff09, U+ff1a-ff1b, U+ff1f, U+ff3b, U+ff3d, U+ff5b, U+ff5d;
}
@font-face {
font-family: "YakuHanMP";
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-Bold.eot);
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-Bold.woff2) format("woff2"), url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-Bold.woff) format("woff");
unicode-range: U+3001-3002, U+300a-3011, U+3014-3015, U+30fb, U+ff01, U+ff08-ff09, U+ff1a-ff1b, U+ff1f, U+ff3b, U+ff3d, U+ff5b, U+ff5d;
}
@font-face {
font-family: "YakuHanMP";
font-style: normal;
font-weight: 900;
font-display: swap;
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-Black.eot);
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-Black.woff2) format("woff2"), url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/YakuHanMP/YakuHanMP-Black.woff) format("woff");
unicode-range: U+3001-3002, U+300a-3011, U+3014-3015, U+30fb, U+ff01, U+ff08-ff09, U+ff1a-ff1b, U+ff1f, U+ff3b, U+ff3d, U+ff5b, U+ff5d;
}
@font-face {
font-family: "icomoon";
src: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/icons/icomoon.ttf?1n3i87) format("truetype"), url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/icons/icomoon.woff?1n3i87) format("woff"), url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/fonts/icons/icomoon.svg?1n3i87#icomoon) format("svg");
font-weight: normal;
font-style: normal;
font-display: block;
}
[class^=icon-],
[class*=" icon-"] {
font-family: "icomoon" !important;
speak: never;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-play:before {
content: "\e90f";
}
.icon-stop:before {
content: "\e910";
}
.icon-check:before {
content: "\e90e";
}
.icon-arrow_line_left:before {
content: "\e90d";
}
.icon-link:before {
content: "\e90c";
}
.icon-faq:before {
content: "\e90a";
}
.icon-triangle_water:before {
content: "\e90b";
}
.icon-book:before {
content: "\e909";
}
.icon-arrow_line02_bottom:before {
content: "\e907";
}
.icon-mail02:before {
content: "\e908";
}
.icon-arrow_circle_right:before {
content: "\e906";
}
.icon-arrow_circle_top:before {
content: "\e905";
}
.icon-arrow_line_bottom:before {
content: "\e904";
}
.icon-arrow_line_top:before {
content: "\e903";
}
.icon-arrow_line_right:before {
content: "\e902";
}
.icon-mail:before {
content: "\e900";
}
.icon-search:before {
content: "\e901";
}
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, dialog, figure, footer, header, hgroup, menu, nav, section, menu, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
-o-text-size-adjust: 100%;
-moz-text-size-adjust: 100%;
text-size-adjust: 100%;
}
section, article, aside, main, dialog, figure, footer, header, hgroup, nav, section {
display: block;
}
address {
font-style: normal;
}
ul, ol {
list-style: none;
}
blockquote,
q {
quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
content: "";
content: none;
}
a {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
ins {
background-color: #ff9;
color: #000;
text-decoration: none;
}
mark {
background-color: #ff9;
color: #000;
font-style: italic;
font-weight: bold;
}
del {
text-decoration: line-through;
}
abbr[title],
dfn[title] {
border-bottom: 1px dotted #000;
cursor: help;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #cccccc;
margin: 1em 0;
padding: 0;
}
input,
button,
select,
option,
textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background: transparent;
border: none;
border-radius: 0;
font: inherit;
outline: none;
}
input,
select {
vertical-align: middle;
}
select::-ms-expand {
display: none;
}
select:-moz-focusring {
color: transparent;
text-shadow: 0 0 0 #000;
}
input[type=text],
input[type=tel],
input[type=email],
input[type=radio],
input[type=submit],
button,
textarea,
select {
font-family: inherit;
margin: 0;
padding: 0;
background: none;
border: none;
border-radius: 0;
outline: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
button {
cursor: pointer;
}
* {
-webkit-appearance: none;
}
*:after,
*:before {
font-family: inherit;
color: inherit;
}
*,
*:after,
*:before {
-webkit-box-sizing: border-box;
-ms-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box;
outline: none;
}
a, area, button, [role=button], input:not([type=range]),
label, select, summary, textarea {
-ms-touch-action: manipulation;
touch-action: manipulation;
}
:root {
-ms-overflow-style: -ms-autohiding-scrollbar;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
-moz-text-size-adjust: 100%;
text-size-adjust: 100%;
cursor: default;
text-rendering: optimizeLegibility;
}
html {
font-size: 14px;
-webkit-tap-highlight-color: transparent;
tap-highlight-color: transparent;
}
html.is-locked {
overflow: hidden;
}
@media screen and (max-width: 768px) {
html.is-locked {
position: fixed;
z-index: -1;
width: 100%;
height: 100%;
}
}
body {
color: #555;
font-family: YakuHanJP, "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Meiryo UI", Meiryo, "メイリオ", "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", sans-serif;
letter-spacing: 0.04em;
-webkit-font-feature-settings: "palt";
font-feature-settings: "palt";
word-break: break-word;
line-break: strict;
overflow-wrap: break-word;
-webkit-font-smoothing: subpixel-antialiased;
-moz-osx-font-smoothing: auto;
-webkit-tap-highlight-color: transparent;
tap-highlight-color: transparent;
background-color: #fff;
opacity: 0;
}
@media screen and (min-width: 769px) {
body {
min-width: 1100px;
}
}
body.is-siteloaded {
opacity: 1;
-webkit-transition: opacity 0.4s ease;
transition: opacity 0.4s ease;
}
body.is-locked {
overflow: hidden;
}
body.lang-en {
word-break: normal;
}
body.lang-en * {
word-break: normal;
}
body.lang-zh-hans {
font-family: "SF Pro SC", "SF Pro Text", "SF Pro Icons", "PingFang SC", "Microsoft YaHei", "微软雅黑", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
}
a {
color: #555;
text-decoration: none;
}
a[href^="tel:"] {
pointer-events: all;
}
@media screen and (min-width: 769px) {
a[href^="tel:"] {
pointer-events: none;
}
}
span {
font-weight: inherit;
line-height: inherit;
letter-spacing: inherit;
}
img, svg {
width: auto;
max-width: 100%;
vertical-align: bottom;
}
img {
height: auto;
}
picture {
display: block;
}
strong,
em {
font-weight: 700;
}
pre {
white-space: pre-wrap;
}
table {
max-width: 100%;
width: 100%;
}
table th,
table td {
word-break: break-all;
}
sup {
font-size: 0.75em;
vertical-align: super;
}
sub {
font-size: 0.75em;
vertical-align: sub;
}
button {
color: inherit;
}
.u-font-en {
font-family: YakuHanMP, "Rajdhani", "Noto Serif JP", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", serif !important;
}
.u-visible-sp {
display: none !important;
}
@media screen and (max-width: 768px) {
.u-visible-sp {
display: block !important;
}
}
@media screen and (max-width: 768px) {
.u-hidden-sp {
display: none !important;
}
}
.hd-txt {
position: absolute;
top: 0;
left: 0;
overflow: hidden;
visibility: hidden;
opacity: 0;
pointer-events: none;
} .slick-slider {
position: relative;
display: block;
-webkit-box-sizing: border-box;
box-sizing: border-box;
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}
.slick-list {
position: relative;
overflow: hidden;
display: block;
margin: 0;
padding: 0;
}
.slick-list:focus {
outline: none;
}
.slick-list.dragging {
cursor: pointer;
cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.slick-track {
position: relative;
left: 0;
top: 0;
display: block;
margin-left: auto;
margin-right: auto;
}
.slick-track:before, .slick-track:after {
content: "";
display: table;
}
.slick-track:after {
clear: both;
}
.slick-loading .slick-track {
visibility: hidden;
}
.slick-slide {
float: left;
height: 100%;
min-height: 1px;
display: none;
}
[dir=rtl] .slick-slide {
float: right;
}
.slick-slide img {
display: block;
}
.slick-slide.slick-loading img {
display: none;
}
.slick-slide.dragging img {
pointer-events: none;
}
.slick-initialized .slick-slide {
display: block;
}
.slick-loading .slick-slide {
visibility: hidden;
}
.slick-vertical .slick-slide {
display: block;
height: auto;
border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
display: none;
}
.cc-window {
opacity: 1;
-webkit-transition: opacity 1s ease;
transition: opacity 1s ease;
}
.cc-window.cc-invisible {
opacity: 0;
}
.cc-animate.cc-revoke {
-webkit-transition: transform 1s ease;
-webkit-transition: -webkit-transform 1s ease;
transition: -webkit-transform 1s ease;
transition: transform 1s ease;
transition: transform 1s ease, -webkit-transform 1s ease;
}
.cc-animate.cc-revoke.cc-top {
-webkit-transform: translateY(-2em);
transform: translateY(-2em);
}
.cc-animate.cc-revoke.cc-bottom {
-webkit-transform: translateY(2em);
transform: translateY(2em);
}
.cc-animate.cc-revoke.cc-active.cc-top {
-webkit-transform: translateY(0);
transform: translateY(0);
}
.cc-animate.cc-revoke.cc-active.cc-bottom {
-webkit-transform: translateY(0);
transform: translateY(0);
}
.cc-revoke:hover {
-webkit-transform: translateY(0);
transform: translateY(0);
}
.cc-grower {
max-height: 0;
overflow: hidden;
-webkit-transition: max-height 1s;
transition: max-height 1s;
}
.cc-revoke, .cc-window {
position: fixed;
overflow: hidden;
-webkit-box-sizing: border-box;
box-sizing: border-box;
font-family: Helvetica, Calibri, Arial, sans-serif;
font-size: 16px;
line-height: 1.5em;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
z-index: 9999;
}
.cc-window.cc-static {
position: static;
}
.cc-window.cc-floating {
padding: 2em;
max-width: 24em;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.cc-window.cc-banner {
padding: 1em 1.8em;
width: 100%;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
}
.cc-revoke {
padding: 0.5em;
}
.cc-revoke:hover {
text-decoration: underline;
}
.cc-header {
font-size: 18px;
font-weight: 700;
}
.cc-btn, .cc-close, .cc-link, .cc-revoke {
cursor: pointer;
}
.cc-link {
opacity: 0.8;
display: inline-block;
padding: 0.2em;
text-decoration: underline;
}
.cc-link:hover {
opacity: 1;
}
.cc-link:active, .cc-link:visited {
color: initial;
}
.cc-btn {
display: block;
padding: 0.4em 0.8em;
font-size: 0.9em;
font-weight: 700;
border-width: 2px;
border-style: solid;
text-align: center;
white-space: nowrap;
}
.cc-highlight .cc-btn:first-child {
background-color: transparent;
border-color: transparent;
}
.cc-highlight .cc-btn:first-child:focus, .cc-highlight .cc-btn:first-child:hover {
background-color: transparent;
text-decoration: underline;
}
.cc-close {
display: block;
position: absolute;
top: 0.5em;
right: 0.5em;
font-size: 1.6em;
opacity: 0.9;
line-height: 0.75;
}
.cc-close:focus, .cc-close:hover {
opacity: 1;
}
.cc-revoke.cc-top {
top: 0;
left: 3em;
border-bottom-left-radius: 0.5em;
border-bottom-right-radius: 0.5em;
}
.cc-revoke.cc-bottom {
bottom: 0;
left: 3em;
border-top-left-radius: 0.5em;
border-top-right-radius: 0.5em;
}
.cc-revoke.cc-left {
left: 3em;
right: unset;
}
.cc-revoke.cc-right {
right: 3em;
left: unset;
}
.cc-top {
top: 1em;
}
.cc-left {
left: 1em;
}
.cc-right {
right: 1em;
}
.cc-bottom {
bottom: 1em;
}
.cc-floating > .cc-link {
margin-bottom: 1em;
}
.cc-floating .cc-message {
display: block;
margin-bottom: 1em;
}
.cc-window.cc-floating .cc-compliance {
-webkit-box-flex: 1;
-ms-flex: 1 0 auto;
flex: 1 0 auto;
}
.cc-window.cc-banner {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.cc-banner.cc-top {
left: 0;
right: 0;
top: 0;
}
.cc-banner.cc-bottom {
left: 0;
right: 0;
bottom: 0;
}
.cc-banner .cc-message {
display: block;
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
max-width: 100%;
margin-right: 1em;
}
.cc-compliance {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-line-pack: justify;
align-content: space-between;
}
.cc-floating .cc-compliance > .cc-btn {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
}
.cc-btn + .cc-btn {
margin-left: 0.5em;
}
@media print {
.cc-revoke, .cc-window {
display: none;
}
}
@media screen and (max-width: 900px) {
.cc-btn {
white-space: normal;
}
}
@media screen and (max-width: 414px) and (orientation: portrait), screen and (max-width: 736px) and (orientation: landscape) {
.cc-window.cc-top {
top: 0;
}
.cc-window.cc-bottom {
bottom: 0;
}
.cc-window.cc-banner, .cc-window.cc-floating, .cc-window.cc-left, .cc-window.cc-right {
left: 0;
right: 0;
}
.cc-window.cc-banner {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.cc-window.cc-banner .cc-compliance {
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
.cc-window.cc-floating {
max-width: none;
}
.cc-window .cc-message {
margin-bottom: 1em;
}
.cc-window.cc-banner {
-webkit-box-align: unset;
-ms-flex-align: unset;
align-items: unset;
}
.cc-window.cc-banner .cc-message {
margin-right: 0;
}
}
.cc-floating.cc-theme-classic {
padding: 1.2em;
border-radius: 5px;
}
.cc-floating.cc-type-info.cc-theme-classic .cc-compliance {
text-align: center;
display: inline;
-webkit-box-flex: 0;
-ms-flex: none;
flex: none;
}
.cc-theme-classic .cc-btn {
border-radius: 5px;
}
.cc-theme-classic .cc-btn:last-child {
min-width: 140px;
}
.cc-floating.cc-type-info.cc-theme-classic .cc-btn {
display: inline-block;
}
.cc-theme-edgeless.cc-window {
padding: 0;
}
.cc-floating.cc-theme-edgeless .cc-message {
margin: 2em;
margin-bottom: 1.5em;
}
.cc-banner.cc-theme-edgeless .cc-btn {
margin: 0;
padding: 0.8em 1.8em;
height: 100%;
}
.cc-banner.cc-theme-edgeless .cc-message {
margin-left: 1em;
}
.cc-floating.cc-theme-edgeless .cc-btn + .cc-btn {
margin-left: 0;
}
.l-wrapper {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
overflow: hidden;
min-height: 100vh;
}
.l-header.is-scrolled .l-header__inner {
border-bottom-color: transparent;
}
@media screen and (min-width: 769px) {
.l-header.is-scrolled .l-header__logo__img {
max-width: 170px;
}
}
@media screen and (min-width: 769px) {
.l-header.is-scrolled .l-header__navSub {
margin: 14px 0 8px;
}
}
.l-header.__narrow .l-header__inner {
padding-top: 20px;
padding-bottom: 20px;
}
.l-header__inner {
background: #fff;
border-bottom: 1px solid #e1e1e3;
width: 100%;
min-width: 1100px;
padding: 0 clamp(60px, 5.46875vw, 70px) 0 clamp(56px, 5.078125vw, 65px);
will-change: border-bottom;
position: fixed;
top: 0;
left: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-transition: padding 0.4s ease, border-bottom-color 0.4s ease;
transition: padding 0.4s ease, border-bottom-color 0.4s ease;
z-index: 999;
}
@media screen and (max-width: 1200px) {
.l-header__inner {
padding: 0 20px;
}
}
@media screen and (max-width: 768px) {
.l-header__inner {
min-width: auto;
height: 60px;
padding: 0 5px;
}
}
.l-header__logo {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.l-header__logo__link {
padding: 5px 20px 5px 5px;
display: block;
-webkit-transition: opacity 0.4s ease;
transition: opacity 0.4s ease;
}
@media screen and (max-width: 768px) {
.l-header__logo__link {
padding-right: 10px;
}
}
@media screen and (min-width: 769px) {
.l-header__logo__link:hover {
opacity: 0.6;
}
}
.l-header__logo__img {
max-width: 186px;
display: block;
-webkit-transition: max-width 0.4s ease;
transition: max-width 0.4s ease;
}
@media screen and (min-width: 769px) {
.l-header__logo__img {
will-change: max-width;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@media screen and (max-width: 768px) {
.l-header__logo__img {
max-width: 128px;
}
}
.l-header__logo__img__item {
width: 100%;
height: auto;
overflow: visible;
will-change: width;
display: inline-block;
}
.l-header__logo__txt {
font-size: 12px;
color: #58595b;
line-height: 1.2;
border-left: 1px solid #ccc;
padding: 4px 0 4px 16px;
display: inline-block;
}
@media screen and (max-width: 768px) {
.l-header__logo__txt {
font-size: 10px;
padding-left: 7px;
-webkit-transform: scale(0.8);
transform: scale(0.8);
-webkit-transform-origin: left center;
transform-origin: left center;
}
}
.l-header__logo__txt svg {
height: 14px;
display: block;
}
@media screen and (max-width: 768px) {
.l-header__nav {
background: rgba(0, 0, 0, 0.8);
width: 100%;
height: calc(100% - 60px);
padding: 30px 30px 65px;
position: fixed;
top: 60px;
left: 0;
display: none;
}
}
@media screen and (max-width: 768px) {
.l-header__nav__inner {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
}
.l-header__navSub {
margin: 20px 0 22px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
-webkit-transition: margin 0.4s ease;
transition: margin 0.4s ease;
}
@media screen and (max-width: 768px) {
.l-header__navSub {
margin: 30px 0 0;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-ordinal-group: 3;
-ms-flex-order: 2;
order: 2;
}
}
.l-header__navSub__list {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
@media screen and (max-width: 768px) {
.l-header__navSub__list {
width: 100%;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-ordinal-group: 2;
-ms-flex-order: 1;
order: 1;
}
}
.l-header__navSub__list__item {
border-left: 1px solid #ccc;
}
@media screen and (max-width: 768px) {
.l-header__navSub__list__item {
text-align: center;
border: none;
-webkit-box-flex: 0;
-ms-flex: 0 0 48%;
flex: 0 0 48%;
}
.l-header__navSub__list__item:nth-child(even) {
margin-left: 4%;
}
.l-header__navSub__list__item:nth-child(n+4) {
margin-top: 24px;
}
}
.l-header__navSub__list__item:last-child {
border-right: 1px solid #ccc;
}
@media screen and (max-width: 768px) {
.l-header__navSub__list__item:last-child {
border: none;
}
}
.l-header__navSub__list__link {
display: block;
}
.l-header__navSub__list__txt {
font-size: 12px;
padding: 2px 12px;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (max-width: 768px) {
.l-header__navSub__list__txt {
font-size: 14px;
color: #fff;
padding: 14px;
position: relative;
display: inline-block;
}
}
.l-header__navSub__list__txt--search {
padding-right: 2em;
position: relative;
}
.l-header__navSub__list__txt--search::before {
content: "\e901";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 12px;
position: absolute;
top: 50%;
right: 1em;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (min-width: 769px) {
.l-header__navSub__list__txt:hover {
color: #888;
}
}
@media screen and (max-width: 768px) {
.l-header__navSub__list__txt::after {
content: "";
background: #ccc;
width: 82px;
height: 1px;
position: absolute;
bottom: 0;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
}
.l-header__navSub__contact {
border-right: 1px solid #ccc;
}
@media screen and (max-width: 768px) {
.l-header__navSub__contact {
border: none;
width: 100%;
margin: 40px 0 0;
-webkit-box-ordinal-group: 3;
-ms-flex-order: 2;
order: 2;
}
}
.l-header__navSub__contact__link {
display: block;
}
@media screen and (max-width: 768px) {
.l-header__navSub__contact__link {
text-align: center;
background: #eb1c24;
width: 100%;
}
}
.l-header__navSub__contact__txt {
font-size: 12px;
padding: 2px 12px;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (max-width: 768px) {
.l-header__navSub__contact__txt {
font-size: 14px;
color: #fff;
line-height: 1.2;
padding: 22px;
display: inline-block;
}
}
@media screen and (min-width: 769px) {
.l-header__navSub__contact__txt:hover {
color: #888;
}
}
.l-header__navSub__contact__icon {
font-size: 10px;
color: #999;
margin: 0 4px 0 0;
}
@media screen and (max-width: 768px) {
.l-header__navSub__contact__icon {
font-size: 11px;
color: inherit;
}
}
.l-header__navSub__lang {
padding: 0 16px;
}
@media screen and (max-width: 768px) {
.l-header__navSub__lang {
-webkit-box-ordinal-group: 5;
-ms-flex-order: 4;
order: 4;
margin: 20px 0 0;
padding: 0;
}
}
.l-header__navSub__lang__link {
font-size: 12px;
font-weight: 500;
color: #999;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
display: inline-block;
}
@media screen and (max-width: 768px) {
.l-header__navSub__lang__link {
font-size: 14px;
color: #fff;
padding: 10px;
}
}
.l-header__navSub__lang__link.is-active {
color: #eb1c24;
text-decoration: underline;
pointer-events: none;
}
@media screen and (min-width: 769px) {
.l-header__navSub__lang__link:hover {
color: inherit;
}
}
.l-header__navSub__lang__link:not(:first-child) {
margin-left: 2px;
}
@media screen and (max-width: 768px) {
.l-header__navSub__lang__link:not(:first-child) {
margin-left: 20px;
}
}
@media screen and (max-width: 768px) {
.l-header__navSub__search {
width: 100%;
margin: 24px 0 0;
-webkit-box-ordinal-group: 4;
-ms-flex-order: 3;
order: 3;
}
}
.l-header__navSub__search__form {
position: relative;
}
input.l-header__navSub__search__box {
font-size: 12px;
border: 1px solid #ccc;
border-radius: 2px;
padding: 5px 32px 5px 5px;
display: block;
}
@media screen and (max-width: 768px) {
input.l-header__navSub__search__box {
color: #fff;
border-radius: 1000px;
width: 100%;
padding: 15px 58px 15px 30px;
}
}
input.l-header__navSub__search__box::-webkit-input-placeholder {
color: #ccc;
}
input.l-header__navSub__search__box::-moz-placeholder {
color: #ccc;
}
input.l-header__navSub__search__box:-ms-input-placeholder {
color: #ccc;
}
input.l-header__navSub__search__box::-ms-input-placeholder {
color: #ccc;
}
input.l-header__navSub__search__box::placeholder {
color: #ccc;
}
.l-header__navSub__search__button {
width: 15px;
height: 15px;
position: absolute;
top: 50%;
right: 12px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
.l-header__navSub__search__button {
width: 20px;
height: 20px;
right: 32px;
}
}
.l-header__navSub__search__button::before {
content: "\e901";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 14px;
color: #555;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (max-width: 768px) {
.l-header__navSub__search__button::before {
font-size: 19px;
color: #ccc;
}
}
@media screen and (min-width: 769px) {
.l-header__navSub__search__button:hover::before {
color: #eb1c24;
}
}
.l-header__navSub__search__button__input {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
cursor: pointer;
display: block;
}
.l-header__navMain {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
@media screen and (max-width: 768px) {
.l-header__navMain {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-ordinal-group: 2;
-ms-flex-order: 1;
order: 1;
}
}
@media screen and (min-width: 769px) {
.l-header__navMain__item:not(:first-child) {
margin-left: 40px;
}
}
@media screen and (max-width: 768px) {
.l-header__navMain__item {
text-align: center;
-webkit-box-flex: 0;
-ms-flex: 0 0 48%;
flex: 0 0 48%;
}
.l-header__navMain__item:nth-child(even) {
margin-left: 4%;
}
.l-header__navMain__item:nth-child(n+3) {
margin-top: 24px;
}
}
.l-header__navMain__link {
display: block;
position: relative;
padding: 10px 0 13px;
}
@media screen and (max-width: 768px) {
.l-header__navMain__link {
padding: 14px;
}
}
.l-header__navMain__link.is-active::after {
-webkit-transform: scale(1, 1);
transform: scale(1, 1);
}
.l-header__navMain__link::after {
content: "";
background: #eb1c24;
width: 100%;
height: 3px;
position: absolute;
bottom: 0;
left: 0;
-webkit-transform: scale(0, 1);
transform: scale(0, 1);
-webkit-transform-origin: left top;
transform-origin: left top;
-webkit-transition: -webkit-transform 0.4s ease;
transition: -webkit-transform 0.4s ease;
transition: transform 0.4s ease;
transition: transform 0.4s ease, -webkit-transform 0.4s ease;
}
@media screen and (max-width: 768px) {
.l-header__navMain__link::after {
background: #ccc;
width: 82px;
height: 1px;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
}
.l-header__navMain__list__txt {
font-size: 14px;
font-weight: 500;
color: #555;
line-height: 1.2;
letter-spacing: 0.12em;
}
@media screen and (max-width: 768px) {
.l-header__navMain__list__txt {
color: #fff;
}
}
@media screen and (max-width: 360px) {
.l-header__navMain__list__txt {
font-size: 13px;
}
}
.l-header__navMain__child {
background: rgba(0, 0, 0, 0.5);
width: 100vw;
min-width: 1100px;
height: 0;
-webkit-transition: all 0.4s ease;
transition: all 0.4s ease;
overflow: hidden;
position: absolute;
top: 100%;
left: 0;
z-index: 999;
}
@media screen and (max-width: 768px) {
.l-header__navMain__child {
display: none;
}
}
.l-header__navMain__child.is-active {
height: 300px;
padding: 50px 0;
z-index: 999;
}
.l-header__navMain__child__inner {
max-width: 900px;
margin: auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.l-header__navMain__child__head {
border-right: 1px solid #fff;
margin: 0 67px 0 0;
-webkit-box-flex: 0;
-ms-flex: 0 0 200px;
flex: 0 0 200px;
}
.l-header__navMain__child__head__inner {
font-size: 20px;
font-weight: 700;
color: #fff;
line-height: 1.2;
padding: 10px 20px 10px 0;
}
.l-header__navMain__child__head__sub {
font-size: 13px;
font-weight: 700;
color: #fff;
line-height: 1.2;
margin-top: 5px;
padding: 0 20px 0 0;
}
.l-header__navMain__child__list {
width: 100%;
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.l-header__navMain__child__list__item {
margin: 0 20px 0 0;
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
.l-header__navMain__child__list__item:only-child {
margin: 0;
}
.l-header__navMain__child__list__link {
margin: 0 0 5px;
display: block;
}
@media screen and (min-width: 769px) {
.l-header__navMain__child__list__link:hover .l-header__navMain__child__list__txt::before {
-webkit-transform: scale(1, 1);
transform: scale(1, 1);
}
}
.l-header__navMain__child__list__link[target=_blank] .l-header__navMain__child__list__txt {
padding-right: 1em;
}
.l-header__navMain__child__list__link[target=_blank] .l-header__navMain__child__list__txt::after {
content: "\e90c";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 10px;
margin-left: 5px;
}
.l-header__navMain__child__list__txt {
font-size: 15px;
font-weight: 500;
color: #fff;
line-height: 1.2;
padding: 10px 3px;
position: relative;
display: inline-block;
}
.l-header__navMain__child__list__txt::before {
content: "";
background: #fff;
width: 100%;
height: 1px;
position: absolute;
bottom: 0;
left: 0;
-webkit-transform: scale(0, 1);
transform: scale(0, 1);
-webkit-transform-origin: left top;
transform-origin: left top;
-webkit-transition: -webkit-transform 0.4s ease;
transition: -webkit-transform 0.4s ease;
transition: transform 0.4s ease;
transition: transform 0.4s ease, -webkit-transform 0.4s ease;
}
.l-header__navMain__child__listSub__wrapper--split {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.l-header__navMain__child__listSub {
padding-left: 1em;
}
.l-header__navMain__child__listSub--split {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.l-header__navMain__child__listSub__item--col:not(:first-child) {
margin-top: 8px;
}
.l-header__navMain__child__listSub__item--col--3 {
-webkit-box-flex: 0;
-ms-flex: 0 0 32%;
flex: 0 0 32%;
}
.l-header__navMain__child__listSub__item--col--3:not(:nth-child(3n+1)) {
margin-left: 2%;
}
.l-header__navMain__child__listSub__item--col--3:nth-child(n+4) {
margin-top: 2%;
}
@media screen and (min-width: 769px) {
.l-header__navMain__child__listSub__link:hover .l-header__navMain__child__listSub__txt::before {
-webkit-transform: scale(1, 1);
transform: scale(1, 1);
}
}
.l-header__navMain__child__listSub__link[target=_blank] .l-header__navMain__child__listSub__txt {
padding-right: 1em;
position: relative;
}
.l-header__navMain__child__listSub__link[target=_blank] .l-header__navMain__child__listSub__txt::after {
content: "\e90c";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 10px;
margin-left: 5px;
}
.l-header__navMain__child__listSub__link + .l-header__navMain__child__listSub {
margin-top: 8px;
}
.l-header__navMain__child__listSub__txt {
font-size: 14px;
font-weight: 500;
line-height: 1.2;
color: #fff;
padding: 5px 3px;
position: relative;
display: inline-block;
}
.l-header__navMain__child__listSub__txt::before {
content: "";
background: #fff;
width: 100%;
height: 1px;
position: absolute;
bottom: 0;
left: 0;
-webkit-transform: scale(0, 1);
transform: scale(0, 1);
-webkit-transform-origin: left top;
transform-origin: left top;
-webkit-transition: -webkit-transform 0.4s ease;
transition: -webkit-transform 0.4s ease;
transition: transform 0.4s ease;
transition: transform 0.4s ease, -webkit-transform 0.4s ease;
}
.l-header__btn {
width: 60px;
height: 60px;
position: absolute;
top: 0;
right: 0;
z-index: 999;
-webkit-transition: 0.4s ease;
transition: 0.4s ease;
display: none;
}
@media screen and (max-width: 768px) {
.l-header__btn {
display: block;
}
}
.l-header__btn.is-active .l-header__btn__bar:nth-of-type(1) {
-webkit-transform: translateY(6px) rotate(-45deg);
transform: translateY(6px) rotate(-45deg);
}
.l-header__btn.is-active .l-header__btn__bar:nth-of-type(2) {
opacity: 0;
-webkit-transform: translateX(20px);
transform: translateX(20px);
}
.l-header__btn.is-active .l-header__btn__bar:nth-of-type(3) {
-webkit-transform: translateY(-6px) rotate(45deg);
transform: translateY(-6px) rotate(45deg);
}
.l-header__btn__inner,
.l-header__btn__bar {
display: inline-block;
}
.l-header__btn__inner {
width: 100%;
height: 26px;
position: relative;
}
@media screen and (max-width: 768px) {
.l-header__btn__inner {
height: 16px;
}
}
.l-header__btn__bar {
background-color: #bdccd4;
width: 24px;
height: 2px;
margin: 0 auto;
position: absolute;
left: 0;
right: 0;
-webkit-transition: opacity 0.4s cubic-bezier(0.77, 0, 0.175, 1), 0.4s background-color ease, -webkit-transform 0.4s cubic-bezier(0.77, 0, 0.175, 1);
transition: opacity 0.4s cubic-bezier(0.77, 0, 0.175, 1), 0.4s background-color ease, -webkit-transform 0.4s cubic-bezier(0.77, 0, 0.175, 1);
transition: transform 0.4s cubic-bezier(0.77, 0, 0.175, 1), opacity 0.4s cubic-bezier(0.77, 0, 0.175, 1), 0.4s background-color ease;
transition: transform 0.4s cubic-bezier(0.77, 0, 0.175, 1), opacity 0.4s cubic-bezier(0.77, 0, 0.175, 1), 0.4s background-color ease, -webkit-transform 0.4s cubic-bezier(0.77, 0, 0.175, 1);
}
.l-header__btn__bar:nth-of-type(1) {
top: calc(50% - 6px);
}
.l-header__btn__bar:nth-of-type(2) {
top: 50%;
}
.l-header__btn__bar:nth-of-type(3) {
top: calc(50% + 6px);
}
.l-content {
min-height: 0%;
}
.l-content.sub {
padding-bottom: 200px;
}
@media screen and (max-width: 768px) {
.l-content.sub {
padding-bottom: 100px;
}
}
.l-container {
max-width: 1040px;
margin: 0 auto;
padding: 0 30px;
}
@media screen and (max-width: 768px) {
.l-container {
width: auto;
padding: 0 5.3333333333%;
}
}
@media screen and (max-width: 768px) {
.l-container.__spWide {
padding: 0 2.6666666667%;
}
}
.l-subIndex__hero {
margin: 80px 0 0;
}
@media screen and (max-width: 768px) {
.l-subIndex__hero {
margin: 40px 0 0;
}
}
.l-subIndex__hero__head__main {
font-size: 36px;
font-weight: 700;
letter-spacing: 0.13em;
border-bottom: 1px solid #d4d4d4;
padding: 0 0 24px;
position: relative;
display: inline-block;
}
@media screen and (max-width: 768px) {
.l-subIndex__hero__head__main {
font-size: 26px;
padding: 0 0 16px;
}
}
.l-subIndex__hero__head__main::first-letter {
color: #d80c24;
}
.l-subIndex__hero__head__main::after {
content: "";
background: #d80c24;
width: 1em;
height: 1px;
position: absolute;
bottom: -1px;
left: 0;
}
.l-subIndex__hero__head__sub {
font-family: YakuHanMP, "Rajdhani", "Noto Serif JP", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", serif;
font-size: 16px;
font-weight: 600;
letter-spacing: 0.1em;
margin: 24px 0 0;
display: block;
}
@media screen and (max-width: 768px) {
.l-subIndex__hero__head__sub {
margin: 16px 0 0;
}
}
.l-subIndex__breadcrumb {
width: 100%;
max-width: 22.28125%;
margin: 14px 0 0 11.71875%;
padding: 0 10px 0 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.l-subIndex__breadcrumb {
max-width: none;
margin: 35px 0 0 0;
padding: 0 10px 0 7%;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
}
}
.l-subIndex__breadcrumb__item {
white-space: nowrap;
}
.l-subIndex__breadcrumb__item:not(:last-child) {
position: relative;
}
.l-subIndex__breadcrumb__item:not(:last-child)::after {
content: "/";
color: #eb1c24;
margin: 0 9px;
}
@media screen and (max-width: 768px) {
.l-subIndex__breadcrumb__item:not(:last-child)::after {
margin: 0 4px;
}
}
.l-subIndex__breadcrumb__item:last-child {
overflow: hidden;
text-overflow: ellipsis;
}
.l-subIndex__breadcrumb__link {
font-size: 12px;
font-weight: 300;
line-height: 1.2;
margin: 2px 0;
}
@media screen and (max-width: 768px) {
.l-subIndex__breadcrumb__link {
font-size: 10px;
}
}
@media screen and (min-width: 769px) {
a.l-subIndex__breadcrumb__link:hover {
text-decoration: underline;
}
}
.l-sub__breadcrumb {
width: 100%;
text-align: right;
margin: 20px 0 0;
}
@media screen and (max-width: 768px) {
.l-sub__breadcrumb {
text-align: left;
margin: 13px 0 0;
}
}
.l-sub__breadcrumb__list {
text-align: left;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.l-sub__breadcrumb__list {
width: 100%;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
}
}
.l-sub__breadcrumb__list__item {
margin: 2px 0;
padding: 3px 0;
-webkit-box-sizing: content-box;
box-sizing: content-box;
}
@media screen and (max-width: 768px) {
.l-sub__breadcrumb__list__item {
font-size: 10px;
white-space: nowrap;
margin: 0;
}
}
.l-sub__breadcrumb__list__item:not(:last-child)::after {
content: "/";
color: #eb1c24;
margin: 0 6px 0 2px;
display: inline-block;
}
@media screen and (max-width: 768px) {
.l-sub__breadcrumb__list__item:not(:last-child)::after {
width: 7px;
}
}
.l-sub__breadcrumb__list__item:last-child {
overflow: hidden;
text-overflow: ellipsis;
}
.l-sub__breadcrumb__list__link {
font-size: 12px;
font-weight: 300;
line-height: 1.2;
}
@media screen and (max-width: 768px) {
.l-sub__breadcrumb__list__link {
font-size: 10px;
}
}
a.l-sub__breadcrumb__list__link {
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (min-width: 769px) {
a.l-sub__breadcrumb__list__link:hover {
color: #eb1c24;
}
}
.l-footer__contact {
padding: 50px 0;
}
.l-footer__contact__blk {
border: 2px solid #d80c24;
padding: 30px 48px 30px 60px;
max-width: 960px;
margin: 0 auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
@media screen and (max-width: 768px) {
.l-footer__contact__blk {
padding: 24px 20px;
display: block;
}
}
.l-footer__contact__txt {
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
.l-footer__contact__txt:not(:last-child) {
margin-right: 20px;
}
@media screen and (max-width: 768px) {
.l-footer__contact__txt:not(:last-child) {
margin: 0 0 16px;
}
}
.l-footer__contact__txt__item {
font-size: 18px;
font-weight: 500;
line-height: 1.2;
letter-spacing: 0.34em;
}
@media screen and (max-width: 768px) {
.l-footer__contact__txt__item {
font-size: 16px;
letter-spacing: 0.1em;
}
}
.l-footer__contact__link {
color: #fff;
text-align: center;
background: #d80c24;
border: 2px solid #d80c24;
min-width: 360px;
padding: 30px 50px;
position: relative;
display: block;
-webkit-transition: color 0.4s ease, background 0.4s ease;
transition: color 0.4s ease, background 0.4s ease;
}
@media screen and (max-width: 768px) {
.l-footer__contact__link {
min-width: auto;
padding: 20px 30px;
}
}
.l-footer__contact__link:after {
content: "\e902";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 12px;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
right: 20px;
}
@media screen and (max-width: 768px) {
.l-footer__contact__link:after {
font-size: 10px;
right: 15px;
}
}
@media screen and (min-width: 769px) {
.l-footer__contact__link:hover {
color: #d80c24;
background: #fff;
}
}
.l-footer__contact__link__txt {
font-size: 18px;
font-weight: 700;
line-height: 1.2;
letter-spacing: 0.42em;
padding: 0 0 0 36px;
position: relative;
}
@media screen and (max-width: 768px) {
.l-footer__contact__link__txt {
font-size: 16px;
padding-left: 30px;
}
}
.l-footer__contact__link__txt::before {
content: "\e908";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 15px;
position: absolute;
top: 50%;
left: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
.l-footer__contact__link__txt::before {
font-size: 12px;
}
}
.l-footer__contents {
padding: 30px 0 0;
}
@media screen and (max-width: 768px) {
.l-footer__contents {
padding: 15px 0 0;
}
}
.l-footer__main__wrapper {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
@media screen and (max-width: 768px) {
.l-footer__main__wrapper {
display: block;
}
}
.l-footer__main {
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
.l-footer__company {
border-bottom: 1px solid #d4d4d4;
padding: 0 0 8px;
}
.l-footer__company__item {
font-size: 25px;
font-weight: 700;
line-height: 1.2;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (max-width: 768px) {
.l-footer__company__item {
font-size: 18px;
}
}
@media screen and (min-width: 769px) {
.l-footer__company__item:hover {
color: #d80c24;
}
}
.l-footer__nav {
margin: 16px 0 0;
}
.l-footer__nav__list {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
@media screen and (max-width: 768px) {
.l-footer__nav__list {
display: block;
}
}
.l-footer__nav__list__item {
-webkit-box-flex: 1;
-ms-flex: 1 0 auto;
flex: 1 0 auto;
}
@media screen and (max-width: 768px) {
.l-footer__nav__list__item:not(:first-child) {
margin-top: 5px;
}
}
.l-footer__nav__list__link {
font-size: 14px;
font-weight: 700;
line-height: 1.2;
padding: 5px;
display: block;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (min-width: 769px) {
a.l-footer__nav__list__link:hover .l-footer__nav__list__link__inner::after {
-webkit-transform: scale(1);
transform: scale(1);
}
}
.l-footer__nav__list__link__inner {
padding: 0 0 5px;
position: relative;
display: inline-block;
}
@media screen and (max-width: 768px) {
.l-footer__nav__list__link__inner {
padding: 0;
}
}
.l-footer__nav__list__link__inner::after {
content: "";
background: #d80c24;
width: 100%;
height: 1px;
position: absolute;
left: 0;
bottom: 0;
-webkit-transform: scale(0, 1);
transform: scale(0, 1);
-webkit-transform-origin: bottom left;
transform-origin: bottom left;
-webkit-transition: -webkit-transform 0.4s ease;
transition: -webkit-transform 0.4s ease;
transition: transform 0.4s ease;
transition: transform 0.4s ease, -webkit-transform 0.4s ease;
}
.l-footer__nav__listSub {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
width: 100%;
max-width: 300px;
}
.l-footer__nav__listSub__item {
-webkit-box-flex: 0;
-ms-flex: 0 0 50%;
flex: 0 0 50%;
}
.l-footer__nav__listSub__link {
font-size: 14px;
line-height: 1.2;
padding: 5px;
display: block;
-webkit-transition: opacity 0.4s ease;
transition: opacity 0.4s ease;
}
@media screen and (min-width: 769px) {
.l-footer__nav__listSub__link:hover .l-footer__nav__listSub__link__inner::after {
-webkit-transform: scale(1);
transform: scale(1);
}
}
.l-footer__nav__listSub__link__inner {
padding: 0 0 5px;
display: inline-block;
position: relative;
}
@media screen and (max-width: 768px) {
.l-footer__nav__listSub__link__inner {
padding: 0;
}
}
.l-footer__nav__listSub__link__inner::after {
content: "";
background: #555;
width: 100%;
height: 1px;
position: absolute;
left: 0;
bottom: 0;
-webkit-transform: scale(0, 1);
transform: scale(0, 1);
-webkit-transform-origin: bottom left;
transform-origin: bottom left;
-webkit-transition: -webkit-transform 0.4s ease;
transition: -webkit-transform 0.4s ease;
transition: transform 0.4s ease;
transition: transform 0.4s ease, -webkit-transform 0.4s ease;
}
.l-footer__group {
-webkit-box-flex: 0;
-ms-flex: 0 0 200px;
flex: 0 0 200px;
margin: 0 0 0 55px;
}
@media screen and (max-width: 768px) {
.l-footer__group {
margin: 20px 0 0;
}
}
.l-footer__group__item {
text-align: center;
}
.l-footer__group__item:not(:first-child) {
margin-top: 10px;
}
.l-footer__group__link {
font-size: 14px;
font-weight: 500;
background: #fff;
border: 1px solid #d4d4d4;
padding: 20px 10px;
position: relative;
display: block;
-webkit-transition: color 0.4s ease, background 0.4s ease;
transition: color 0.4s ease, background 0.4s ease;
}
.l-footer__group__link::after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 10px 10px;
border-color: transparent transparent #d80c24 transparent;
position: absolute;
right: 0;
bottom: 0;
}
@media screen and (min-width: 769px) {
.l-footer__group__link:hover {
color: #fff;
background: #d80c24;
border-color: #d80c24;
}
}
.l-footer__bottom {
margin: 80px 0 0;
}
@media screen and (max-width: 768px) {
.l-footer__bottom {
margin: 40px 0 0;
}
}
.l-footer__navSub__list {
padding-left: 1px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.l-footer__navSub__list__item {
margin-left: -1px;
padding: 2px 5px;
position: relative;
}
.l-footer__navSub__list__item::before, .l-footer__navSub__list__item::after {
content: "";
background: #d4d4d4;
width: 1px;
height: 60%;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.l-footer__navSub__list__item::before {
left: 0;
}
.l-footer__navSub__list__item::after {
right: 0;
}
.l-footer__navSub__list__link {
font-size: 13px;
line-height: 1.2;
height: 100%;
padding: 5px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-transition: opacity 0.4s ease;
transition: opacity 0.4s ease;
}
@media screen and (max-width: 768px) {
.l-footer__navSub__list__link {
font-size: 10px;
padding: 8px 4px;
}
}
@media screen and (min-width: 769px) {
.l-footer__navSub__list__link:hover {
opacity: 0.6;
}
}
.l-footer__copyright {
text-align: right;
padding: 10px 0;
}
.l-footer__copyright__txt {
font-size: 12px;
line-height: 1.2;
}
@media screen and (max-width: 768px) {
.l-footer__copyright__txt {
font-size: 10px;
}
}
.remodal-overlay {
background: rgba(0, 0, 0, 0.5);
}
.l-modal__closeCross {
width: 50px;
height: 50px;
position: absolute;
top: -50px;
right: 0;
}
.l-modal__closeCross::before, .l-modal__closeCross::after {
content: "";
background: #fff;
width: 30px;
height: 1px;
position: absolute;
top: 50%;
left: 50%;
-webkit-transition: opacity 0.4s ease;
transition: opacity 0.4s ease;
will-change: opacity;
}
.l-modal__closeCross::before {
-webkit-transform: translate(-50%, -50%) rotate(45deg);
transform: translate(-50%, -50%) rotate(45deg);
}
.l-modal__closeCross::after {
-webkit-transform: translate(-50%, -50%) rotate(-45deg);
transform: translate(-50%, -50%) rotate(-45deg);
}
.l-modal__closeCross:hover::before, .l-modal__closeCross:hover::after {
opacity: 0.6;
}
.l-modal__closeTxt {
font-size: 16px;
text-align: center;
letter-spacing: 0.05em;
border: 1px solid #ccc;
margin: 24px 0 0;
padding: 10px 30px;
display: inline-block;
}
.l-pagination {
margin: 60px 0 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
@media screen and (max-width: 768px) {
.l-pagination {
margin: 32px 0 0;
}
}
.l-pagination > * {
margin-bottom: 5px;
}
.l-pagination .page-numbers {
font-size: 20px;
text-align: center;
line-height: 40px;
width: 40px;
height: 40px;
display: inline-block;
position: relative;
}
@media screen and (max-width: 768px) {
.l-pagination .page-numbers {
font-size: 18px;
}
}
.l-pagination .page-numbers.current {
color: #fff;
background: #a0bdd4;
pointer-events: none;
}
.l-pagination .page-numbers:not(:first-child) {
margin-left: 5px;
}
.l-pagination a.page-numbers {
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (min-width: 769px) {
.l-pagination a.page-numbers:hover {
color: #a0bdd4;
}
}
@media screen and (max-width: 768px) {
.ul-widget-main-window.mobile-layout.ul-widget-hide {
bottom: 60px !important;
}
}
.lang-en .l-header__logo__img {
max-width: 214px;
}
@media screen and (max-width: 768px) {
.lang-en .l-header__logo__img {
max-width: 147px;
}
}
@media screen and (min-width: 769px) {
.lang-en .l-header.is-scrolled .l-header__logo__img {
max-width: 196px;
}
}
.lang-en .l-footer__nav__listSub {
max-width: 450px;
}
@media screen and (min-width: 769px) {
.lang-zh-hans .l-header__navSub {
margin-top: 36px;
}
}
.otgs-development-site-front-end {
display: none;
}
.c-heading01__inner {
font-size: 26px;
line-height: 1.2;
border-top: 1px solid #d4d4d4;
border-bottom: 1px solid #d4d4d4;
padding: 20px 5px;
position: relative;
display: block;
}
@media screen and (max-width: 768px) {
.c-heading01__inner {
font-size: 20px;
padding: 15px 5px;
}
}
.c-heading01__inner::before {
content: "";
background: #d80c24;
width: 1.5em;
height: 1px;
position: absolute;
bottom: -1px;
left: 0;
}
a.c-heading01__inner {
padding-right: 60px;
}
@media screen and (max-width: 768px) {
a.c-heading01__inner {
padding-right: 30px;
}
}
a.c-heading01__inner::after {
content: "\e906";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 25px;
color: #d80c24;
position: absolute;
top: 50%;
right: 20px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: right 0.4s ease;
transition: right 0.4s ease;
}
@media screen and (max-width: 768px) {
a.c-heading01__inner::after {
font-size: 14px;
right: 5px;
}
}
@media screen and (min-width: 769px) {
a.c-heading01__inner:hover {
color: #d80c24;
}
a.c-heading01__inner:hover::after {
right: 10px;
}
}
.c-heading01__main {
font-size: inherit;
font-weight: 700;
color: inherit;
letter-spacing: 0.1em;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-heading01__main {
letter-spacing: 0.1em;
display: inline-block;
}
}
.c-heading01__main::first-letter {
color: #d80c24;
}
.c-heading01__sub {
font-size: 16px;
letter-spacing: 0.16em;
}
@media screen and (max-width: 768px) {
.c-heading01__sub {
font-size: 13px;
padding: 3px 0 0;
display: block;
}
}
.c-productsHero {
background: #e9ebed;
margin: 110px 0 0;
padding: 20px 0;
}
@media screen and (max-width: 768px) {
.c-productsHero {
margin: 60px 0 0;
padding: 24px 0;
}
}
.c-productsHero__ttl {
text-align: center;
}
.c-productsHero__ttl__main {
font-size: 22px;
font-weight: 700;
color: #8f99a3;
line-height: 1.2;
letter-spacing: 0.24em;
}
@media screen and (max-width: 768px) {
.c-productsHero__ttl__main {
font-size: 18px;
}
}
.c-news__index {
margin: 100px 0 160px;
}
@media screen and (max-width: 768px) {
.c-news__index {
margin: 50px 0;
}
}
.c-news__index__year {
margin: 40px 0 0;
}
@media screen and (max-width: 768px) {
.c-news__index__year {
margin: 24px 0 0;
}
}
.c-news__index__year__list {
max-width: 880px;
margin: 0 auto;
}
@media screen and (max-width: 768px) {
.c-news__index__year__list {
max-width: 90%;
}
}
.c-news__index__year__list__inner {
margin: 0 16px;
}
@media screen and (max-width: 768px) {
.c-news__index__year__list__inner {
margin: 0 5px;
}
}
.c-news__index__year__list__link {
font-size: 16px;
color: inherit;
background: #f2f2f3;
border: 1px solid #f2f2f3;
text-align: center;
padding: 14px;
display: block;
-webkit-transition: color 0.4s ease, background 0.4s ease, border-color 0.4s ease;
transition: color 0.4s ease, background 0.4s ease, border-color 0.4s ease;
}
.c-news__index__year__list__link.is-active {
color: #eb1c24;
background: #fff;
border-color: #eb1c24;
pointer-events: none;
}
@media screen and (min-width: 769px) {
.c-news__index__year__list__link:hover {
color: #fff;
background: #eb1c24;
border-color: #eb1c24;
}
}
.c-news__index__year__arrow {
width: 15px;
height: 20px;
padding: 5px;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
display: block;
}
.c-news__index__year__arrow::after {
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 10px;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
.c-news__index__year__arrow.__prev {
right: 100%;
}
@media screen and (max-width: 768px) {
.c-news__index__year__arrow.__prev {
right: 102%;
}
}
.c-news__index__year__arrow.__prev::after {
content: "\e90d";
}
.c-news__index__year__arrow.__next {
left: 100%;
}
@media screen and (max-width: 768px) {
.c-news__index__year__arrow.__next {
left: 102%;
}
}
.c-news__index__year__arrow.__next::after {
content: "\e902";
}
@media screen and (min-width: 769px) {
.c-news__index__year__arrow:hover::after {
color: #eb1c24;
}
}
.c-news__index__cont {
margin: 40px 0 0;
}
@media screen and (max-width: 768px) {
.c-news__index__cont {
margin: 20px 0 0;
}
}
.c-news__index__list__item {
border-bottom: 1px solid #ccc;
}
.c-news__index__list__item:first-child {
border-top: 1px solid #ccc;
}
.c-news__index__list__link {
padding: 32px 0;
display: block;
}
@media screen and (max-width: 768px) {
.c-news__index__list__link {
padding: 20px 0;
}
}
@media screen and (min-width: 769px) {
.c-news__index__list__link:hover .c-news__index__list__ttl__inner {
text-decoration: underline;
}
}
.c-news__index__list__date {
font-size: 14px;
letter-spacing: 0.07em;
}
@media screen and (max-width: 768px) {
.c-news__index__list__date {
font-size: 12px;
}
}
.c-news__index__list__ctg {
font-size: 14px;
color: #eb1c24;
letter-spacing: 0.2em;
text-align: center;
border: 1px solid #eb1c24;
width: 100%;
max-width: 110px;
margin: 0 0 0 32px;
padding: 5px 10px;
display: inline-block;
}
@media screen and (max-width: 768px) {
.c-news__index__list__ctg {
font-size: 12px;
max-width: 80px;
margin: 0 0 0 10px;
padding: 3px 10px;
}
}
.c-news__index__list__ttl {
font-size: 16px;
line-height: 1.2;
letter-spacing: 0.07em;
margin: 12px 0 0;
}
@media screen and (max-width: 768px) {
.c-news__index__list__ttl {
font-size: 14px;
margin: 8px 0 0;
}
}
.c-news__index__list__ttl--pdf .c-news__index__list__ttl__inner {
padding: 0 36px 0 0;
position: relative;
}
@media screen and (max-width: 768px) {
.c-news__index__list__ttl--pdf .c-news__index__list__ttl__inner {
padding: 0 26px 0 0;
}
}
.c-news__index__list__ttl--pdf .c-news__index__list__ttl__inner::after {
content: "";
background: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/img/common/icon-pdf.png) no-repeat center center/contain;
width: 30px;
height: 29px;
position: absolute;
top: 50%;
right: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
.c-news__index__list__ttl--pdf .c-news__index__list__ttl__inner::after {
width: 18px;
height: 17px;
}
}
.c-news__index__list__ttl__inner {
display: inline-block;
}
.c-news__index__exhibition__item {
border-bottom: 1px solid #ccc;
}
.c-news__index__exhibition__item:first-child {
border-top: 1px solid #ccc;
}
.c-news__index__exhibition__inner {
padding: 40px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
@media screen and (max-width: 768px) {
.c-news__index__exhibition__inner {
padding: 24px 0;
display: block;
}
}
.c-news__index__exhibition__fig {
text-align: center;
-webkit-box-flex: 0;
-ms-flex: 0 0 50%;
flex: 0 0 50%;
}
.c-news__index__exhibition__fig__img {
max-width: 300px;
}
.c-news__index__exhibition__detail {
-webkit-box-flex: 0;
-ms-flex: 0 0 45%;
flex: 0 0 45%;
}
@media screen and (max-width: 768px) {
.c-news__index__exhibition__detail {
margin: 20px 0 0;
}
}
.c-news__index__exhibition__ctg {
font-size: 16px;
text-align: center;
border: 1px solid #ccc;
width: 100%;
max-width: 110px;
padding: 5px 10px;
display: inline-block;
}
.c-news__index__exhibition__ttl {
margin: 16px 0 0;
}
@media screen and (max-width: 768px) {
.c-news__index__exhibition__ttl {
margin: 8px 0 0;
}
}
.c-news__index__exhibition__ttl__inner {
font-size: 24px;
font-weight: 500;
line-height: 1.58;
display: block;
}
@media screen and (max-width: 768px) {
.c-news__index__exhibition__ttl__inner {
font-size: 18px;
}
}
@media screen and (min-width: 769px) {
.c-news__index__exhibition__ttl__inner:hover {
text-decoration: underline;
}
}
.c-news__index__exhibition__information {
margin: 20px 0 0;
}
@media screen and (max-width: 768px) {
.c-news__index__exhibition__information {
margin: 10px 0 0;
}
}
.c-news__index__exhibition__information__dl {
font-size: 16px;
line-height: 1.3;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
@media screen and (max-width: 768px) {
.c-news__index__exhibition__information__dl {
font-size: 14px;
}
}
.c-news__index__exhibition__information__dl:not(:first-child) {
margin-top: 10px;
}
@media screen and (max-width: 768px) {
.c-news__index__exhibition__information__dl:not(:first-child) {
margin-top: 5px;
}
}
.c-news__index__exhibition__information__dt {
font-weight: 500;
letter-spacing: 0.1em;
-moz-text-align-last: justify;
text-align-last: justify;
margin: 0 32px 0 0;
-webkit-box-flex: 0;
-ms-flex: 0 0 60px;
flex: 0 0 60px;
}
@media screen and (max-width: 768px) {
.c-news__index__exhibition__information__dt {
margin: 0 16px 0 0;
}
}
.c-news__index__exhibition__information__dd {
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
.c-news__index__exhibition__link {
font-size: 16px;
color: #eb1c24;
letter-spacing: 0.07em;
text-align: center;
border: 1px solid #eb1c24;
margin: 24px 0 0;
padding: 22px 50px;
position: relative;
display: block;
-webkit-transition: color 0.4s ease, background 0.4s ease;
transition: color 0.4s ease, background 0.4s ease;
}
.c-news__index__exhibition__link::after {
content: "\e909";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 16px;
position: absolute;
top: 50%;
right: 20px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (min-width: 769px) {
.c-news__index__exhibition__link:hover {
color: #fff;
background: #eb1c24;
}
}
.c-news__index__nopost {
font-size: 18px;
font-weight: 500;
line-height: 1.3;
text-align: center;
margin-top: 80px;
display: block;
}
@media screen and (max-width: 768px) {
.c-news__index__nopost {
font-size: 14px;
margin-top: 60px;
}
}
.c-news__single {
margin: 100px 0;
}
@media screen and (max-width: 768px) {
.c-news__single {
margin: 50px 0;
}
}
.c-news__single__ttl {
font-size: 36px;
font-weight: 700;
line-height: 1.3;
letter-spacing: 0.14em;
border-bottom: 1px solid #ccc;
padding: 0 0 20px;
position: relative;
}
@media screen and (max-width: 768px) {
.c-news__single__ttl {
font-size: 18px;
padding: 0 0 16px;
}
}
.c-news__single__ttl::after {
content: "";
background: #d80c24;
width: 1em;
height: 1px;
position: absolute;
bottom: -1px;
left: 0;
}
.c-news__single__cont {
margin: 40px 0 0;
}
@media screen and (max-width: 768px) {
.c-news__single__cont {
margin: 32px 0 0;
}
}
.c-news__single__cont h3 {
font-size: 22px;
font-weight: 500;
line-height: 1.2;
letter-spacing: 0.14em;
border-bottom: 1px solid #d4d4d4;
padding: 0 0 20px;
}
@media screen and (max-width: 768px) {
.c-news__single__cont h3 {
font-size: 16px;
padding: 15px 0;
}
}
.c-news__single__cont h3:not(:first-child) {
margin-top: 60px;
}
@media screen and (max-width: 768px) {
.c-news__single__cont h3:not(:first-child) {
margin-top: 30px;
}
}
.c-news__single__cont em {
font-weight: inherit;
font-style: italic;
}
.c-news__single__cont p {
font-size: 16px;
line-height: 2;
letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
.c-news__single__cont p {
font-size: 14px;
line-height: 1.8;
}
}
.c-news__single__cont p:not(:first-child) {
margin-top: 24px;
}
.c-news__single__cont a {
text-decoration: underline;
}
@media screen and (min-width: 769px) {
.c-news__single__cont a:hover {
text-decoration: none;
}
}
.c-news__single__cont ul {
font-size: 16px;
line-height: 2;
letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
.c-news__single__cont ul {
font-size: 14px;
line-height: 1.8;
}
}
.c-news__single__cont ul li {
position: relative;
padding-left: 1em;
}
.c-news__single__cont ul li::before {
content: "・";
position: absolute;
left: 0;
}
.c-news__single__cont ol {
font-size: 16px;
line-height: 2;
letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
.c-news__single__cont ol {
font-size: 14px;
line-height: 1.8;
}
}
.c-news__single__cont ol li {
position: relative;
padding-left: 2em;
counter-increment: num;
}
.c-news__single__cont ol li::before {
content: counter(num) ".";
position: absolute;
left: 0;
}
.c-news__single__cont img {
display: block;
}
.c-news__single__cont img.aligncenter {
margin-left: auto;
margin-right: auto;
}
.c-news__single__cont img.alignright {
margin-left: auto;
}
.c-news__single__cont table th, .c-news__single__cont table td {
font-size: 16px;
line-height: 1.3;
letter-spacing: 0.05em;
border: 1px solid #d4d4d4;
padding: 20px;
}
@media screen and (max-width: 768px) {
.c-news__single__cont table th, .c-news__single__cont table td {
font-size: 14px;
}
}
.c-news__single__cont table th {
background: #e9ebed;
}
.c-news__single__cont table:not(:first-child) {
margin-top: 24px;
}
.c-news__single__cont figure {
display: block;
}
.c-news__single__cont figure a {
display: block;
-webkit-transition: opacity 0.4s ease;
transition: opacity 0.4s ease;
}
@media screen and (min-width: 769px) {
.c-news__single__cont figure a:hover {
opacity: 0.6;
}
}
.c-news__single__cont figure:not(:first-child) {
margin-top: 24px;
}
.c-news__single__exhibition__ttl {
font-size: 28px;
font-weight: 700;
line-height: 1.3;
text-align: justify;
padding-left: 1.2em;
position: relative;
}
@media screen and (max-width: 768px) {
.c-news__single__exhibition__ttl {
font-size: 18px;
}
}
.c-news__single__exhibition__ttl::before {
content: "■";
font-size: 24px;
color: #d4d4d4;
position: absolute;
top: 2px;
left: 0;
}
@media screen and (max-width: 768px) {
.c-news__single__exhibition__ttl::before {
font-size: 16px;
}
}
.c-news__single__exhibition__eyecatch {
text-align: center;
margin: 60px auto 0;
}
@media screen and (max-width: 768px) {
.c-news__single__exhibition__eyecatch {
margin: 30px auto 0;
}
}
.c-news__single__exhibition__eyecatch__img {
max-width: 340px;
margin: 0 auto;
}
@media screen and (max-width: 768px) {
.c-news__single__exhibition__eyecatch__img {
max-width: 100%;
}
}
.c-news__single__exhibition__cont__detail {
border-bottom: 1px solid #d4d4d4;
}
.c-news__single__exhibition__cont__detail__dl {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
padding: 20px 0;
}
@media screen and (max-width: 768px) {
.c-news__single__exhibition__cont__detail__dl {
padding: 15px 0;
}
}
.c-news__single__exhibition__cont__detail__dl:not(:first-child) {
border-top: 1px solid #d4d4d4;
}
.c-news__single__exhibition__cont__detail__dt {
font-size: 18px;
line-height: 1.2;
text-align: center;
background: #f4f5f6;
padding: 10px;
-webkit-box-flex: 0;
-ms-flex: 0 0 15%;
flex: 0 0 15%;
}
@media screen and (max-width: 768px) {
.c-news__single__exhibition__cont__detail__dt {
font-size: 14px;
max-width: 200px;
min-width: 100px;
-webkit-box-flex: 0;
-ms-flex: 0 0 30%;
flex: 0 0 30%;
}
}
.c-news__single__exhibition__cont__detail__dd {
font-size: 16px;
line-height: 2;
margin-left: 20px;
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
@media screen and (max-width: 768px) {
.c-news__single__exhibition__cont__detail__dd {
font-size: 14px;
line-height: 1.6;
margin-top: 6px;
}
}
.c-news__single__exhibition__cont__detail__dd a {
text-decoration: underline;
}
@media screen and (min-width: 769px) {
.c-news__single__exhibition__cont__detail__dd a:hover {
text-decoration: none;
}
}
.c-news__single__exhibition__cont__link {
margin: 72px 0 0;
}
@media screen and (max-width: 768px) {
.c-news__single__exhibition__cont__link {
margin: 36px 0 0;
}
}
.c-news__single__exhibition__cont__link__item {
font-size: 22px;
font-weight: 500;
color: #fff;
line-height: 1.2;
text-align: center;
background: #d80c24;
border: 2px solid #d80c24;
max-width: 70%;
margin: 0 auto;
padding: 14px 30px;
position: relative;
display: block;
-webkit-transition: color 0.4s ease, background 0.4s ease;
transition: color 0.4s ease, background 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-news__single__exhibition__cont__link__item {
font-size: 14px;
max-width: 100%;
}
}
.c-news__single__exhibition__cont__link__item:not(:first-child) {
margin-top: 10px;
}
.c-news__single__exhibition__cont__link__item::after {
content: "\e902";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 14px;
position: absolute;
top: 50%;
right: 15px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: right 0.4s ease;
transition: right 0.4s ease;
}
@media screen and (min-width: 769px) {
.c-news__single__exhibition__cont__link__item:hover {
color: #d80c24;
background: #fff;
}
.c-news__single__exhibition__cont__link__item:hover::after {
right: 10px;
}
}
.c-news__single__footer {
text-align: center;
max-width: 550px;
margin: 100px auto 0;
position: relative;
}
@media screen and (max-width: 768px) {
.c-news__single__footer {
margin: 40px auto 0;
}
}
.c-news__single__footer__link {
font-size: 16px;
text-align: center;
display: inline-block;
-webkit-transition: color 0.4s ease, background 0.4s ease;
transition: color 0.4s ease, background 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-news__single__footer__link {
font-size: 12px;
}
}
.c-news__single__footer__link.__index {
background: #f4f5f6;
padding: 12px 20px;
}
@media screen and (max-width: 768px) {
.c-news__single__footer__link.__index {
padding: 15px;
}
}
@media screen and (min-width: 769px) {
.c-news__single__footer__link.__index:hover {
background: #d80c24;
color: #fff;
}
}
.c-news__single__footer__link.__prev, .c-news__single__footer__link.__next {
padding: 5px 0;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.c-news__single__footer__link.__prev::before, .c-news__single__footer__link.__next::before {
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 10px;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (min-width: 769px) {
.c-news__single__footer__link.__prev:hover, .c-news__single__footer__link.__next:hover {
color: #d80c24;
}
}
.c-news__single__footer__link.__prev {
left: 0;
padding-left: 1em;
}
.c-news__single__footer__link.__prev::before {
content: "\e90d";
left: 0;
}
.c-news__single__footer__link.__next {
right: 0;
padding-right: 1em;
}
.c-news__single__footer__link.__next::before {
content: "\e902";
right: 0;
}
.c-subPage__main {
margin: 64px 0 80px;
}
@media screen and (max-width: 768px) {
.c-subPage__main {
margin: 32px 0;
}
}
.c-subPage__main .__indent {
padding-left: 2em;
}
.c-subPage__main__txt {
font-size: 16px;
line-height: 1.9;
}
.c-subPage__main__txt.__text-align--right {
text-align: right;
}
.c-subPage__main__txt + .c-subPage__main__txt {
margin-top: 2em;
}
.c-subPage__main__txt:not(:first-child) {
margin-top: 32px;
}
@media screen and (max-width: 768px) {
.c-subPage__main__txt:not(:first-child) {
margin-top: 20px;
}
}
.c-subPage__main__txt__link {
word-break: break-all;
text-decoration: underline;
}
.c-subPage__main__txt__link:not(:first-child) {
margin-top: 32px;
}
@media screen and (max-width: 768px) {
.c-subPage__main__txt__link:not(:first-child) {
margin-top: 20px;
}
}
@media screen and (min-width: 769px) {
.c-subPage__main__txt__link:hover {
text-decoration: none;
}
}
.c-subPage__main__ttl:not(:first-child) {
margin-top: 70px;
}
@media screen and (max-width: 768px) {
.c-subPage__main__ttl:not(:first-child) {
margin-top: 40px;
}
}
.c-subPage__main__ttl--counter {
counter-increment: ttlNum;
}
@media screen and (max-width: 768px) {
.c-subPage__main__ttl--counter .c-subPage__main__ttl__inner {
padding-left: 0.3em;
}
}
.c-subPage__main__ttl--counter .c-subPage__main__ttl__main {
padding-left: 1.6em;
position: relative;
}
.c-subPage__main__ttl--counter .c-subPage__main__ttl__main::before {
content: counter(ttlNum) ". ";
text-align: right;
width: 1.5em;
position: absolute;
left: 0;
}
.c-subPage__main__ttl__inner {
border-left: 3px solid #d80c24;
padding: 0 0 0 0.8em;
display: block;
}
.c-subPage__main__ttl__main {
font-size: 25px;
line-height: 1.2;
display: inline-block;
}
@media screen and (max-width: 768px) {
.c-subPage__main__ttl__main {
font-size: 18px;
}
}
.c-subPage__main__ttl02 {
background: #f4f5f6;
}
.c-subPage__main__ttl02:not(:first-child) {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-subPage__main__ttl02:not(:first-child) {
margin-top: 24px;
}
}
.c-subPage__main__ttl02--counter {
counter-increment: ttl02Num;
}
.c-subPage__main__ttl02--counter .c-subPage__main__ttl02__main {
padding-left: 1.6em;
position: relative;
}
.c-subPage__main__ttl02--counter .c-subPage__main__ttl02__main::before {
content: counter(ttl02Num) ". ";
text-align: right;
width: 1.5em;
position: absolute;
left: 0;
}
.c-subPage__main__ttl__inner {
border-left: 3px solid #d80c24;
padding: 0 0 0 0.8em;
display: block;
}
.c-subPage__main__ttl02__main {
font-size: 20px;
font-weight: 500;
line-height: 1.2;
letter-spacing: 0.1em;
padding: 0.8em;
display: inline-block;
}
@media screen and (max-width: 768px) {
.c-subPage__main__ttl02__main {
font-size: 16px;
}
}
.c-subPage__main__olPeriod:not(:first-child) {
margin-top: 32px;
}
@media screen and (max-width: 768px) {
.c-subPage__main__olPeriod:not(:first-child) {
margin-top: 20px;
}
}
.c-subPage__main__olPeriod__item {
counter-increment: listPeriod;
}
.c-subPage__main__olPeriod__item .c-subPage__main__txt {
padding-left: 1.8em;
position: relative;
}
.c-subPage__main__olPeriod__item .c-subPage__main__txt::before {
content: counter(listPeriod) ".";
position: absolute;
left: 0;
}
.c-subPage__main__olPeriod__item:not(:first-child) {
margin-top: 32px;
}
@media screen and (max-width: 768px) {
.c-subPage__main__olPeriod__item:not(:first-child) {
margin-top: 20px;
}
}
.c-subPage__main__olBrackets:not(:first-child) {
margin-top: 32px;
}
@media screen and (max-width: 768px) {
.c-subPage__main__olBrackets:not(:first-child) {
margin-top: 20px;
}
}
.c-subPage__main__olBrackets__item {
counter-increment: listBrackets;
}
.c-subPage__main__olBrackets__item .c-subPage__main__txt {
padding-left: 1.8em;
position: relative;
}
.c-subPage__main__olBrackets__item .c-subPage__main__txt::before {
content: "（" counter(listBrackets) "）";
position: absolute;
left: 0;
}
.c-subPage__main__ulDots:not(:first-child) {
margin-top: 32px;
}
@media screen and (max-width: 768px) {
.c-subPage__main__ulDots:not(:first-child) {
margin-top: 20px;
}
}
.c-subPage__main__ulDots__item .c-subPage__main__txt {
padding-left: 1em;
position: relative;
}
.c-subPage__main__ulDots__item .c-subPage__main__txt::before {
content: "・";
position: absolute;
left: 0;
}
.c-subPage__main__back {
text-align: center;
}
.c-subPage__main__back:not(:first-child) {
margin-top: 50px;
}
@media screen and (max-width: 768px) {
.c-subPage__main__back:not(:first-child) {
margin-top: 30px;
}
}
.c-subPage__main__back__link {
font-size: 16px;
line-height: 1.2;
letter-spacing: 0.05em;
border: 1px solid #d4d4d4;
padding: 5px 44px;
position: relative;
display: inline-block;
-webkit-transition: color 0.4s ease, background 0.4s ease;
transition: color 0.4s ease, background 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-subPage__main__back__link {
font-size: 14px;
padding: 14px 60px;
}
}
.c-subPage__main__back__link::before {
content: "\e90d";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 13px;
color: #d4d4d4;
position: absolute;
top: 50%;
left: 20px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (min-width: 769px) {
.c-subPage__main__back__link:hover {
color: #fff;
background: #d4d4d4;
}
.c-subPage__main__back__link:hover::before {
color: #fff;
}
}
.c-error__main__ttl__inner {
max-width: 1040px;
margin: 112px auto 60px;
padding-top: 50px;
overflow: hidden;
}
@media screen and (max-width: 768px) {
.c-error__main__ttl__inner {
margin: 60px auto 30px;
padding-top: 30px;
}
}
.c-error__main__ttl {
font-size: 120px;
font-family: YakuHanMP, "Rajdhani", "Noto Serif JP", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", serif;
font-weight: 600;
letter-spacing: 0.1em;
text-align: center;
display: block;
}
@media screen and (max-width: 768px) {
.c-error__main__ttl {
font-size: 70px;
}
}
.c-error__sub__ttl {
font-family: YakuHanMP, "Rajdhani", "Noto Serif JP", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", serif;
font-weight: 600;
font-size: 24px;
letter-spacing: 0.3em;
text-align: center;
display: block;
}
@media screen and (max-width: 768px) {
.c-error__sub__ttl {
font-size: 18px;
margin-top: 5px;
}
}
.c-error__txt__inner {
max-width: 1040px;
margin: 0 auto;
padding: 0 30px 100px;
}
@media screen and (max-width: 768px) {
.c-error__txt__inner {
padding: 0 30px 30px;
}
}
.c-error__main__txt {
font-size: 32px;
font-weight: 500;
line-height: 1.3;
letter-spacing: 0.1em;
display: block;
}
@media screen and (max-width: 768px) {
.c-error__main__txt {
font-size: 26px;
}
}
span.c-error__main__txt {
text-align: center;
}
.c-error__txt {
font-size: 18px;
line-height: 1.8;
letter-spacing: 0.1em;
text-align: center;
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-error__txt {
margin-top: 30px;
line-height: 1.7;
}
}
.c-top__link {
color: #fff;
text-align: center;
background: #d80c24;
border: 2px solid #d80c24;
max-width: 360px;
margin: 40px auto 0;
padding: 20px 50px;
position: relative;
display: block;
-webkit-transition: color 0.4s ease, background 0.4s ease;
transition: color 0.4s ease, background 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-top__link {
margin: 30px auto 0;
min-width: auto;
padding: 12px 30px;
}
}
.c-top__link:hover {
color: #d80c24;
background: #fff;
}
.c-top__link:after {
content: "\e902";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 12px;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
right: 20px;
}
.c-top__link__txt {
font-size: 18px;
font-weight: 700;
line-height: 1.2;
letter-spacing: 0.42em;
position: relative;
}
.lang-en .c-news__index__list__ctg {
max-width: 150px;
}
@media screen and (max-width: 768px) {
.lang-en .c-news__index__list__ctg {
width: auto;
max-width: none;
}
}

.p-productsDetail__contact {
background: #e9ebed;
padding: 50px 0;
}
@media screen and (max-width: 768px) {
.p-productsDetail__contact {
padding: 40px 0;
}
}
.p-productsDetail__contact__inner {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
@media screen and (max-width: 768px) {
.p-productsDetail__contact__inner {
display: block;
}
}
.p-productsDetail__contact__blk {
background: #fff;
border: 5px solid #d80c24;
padding: 40px;
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
@media screen and (max-width: 768px) {
.p-productsDetail__contact__blk {
border-width: 3px;
padding: 24px;
}
}
.p-productsDetail__contact__head {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
@media screen and (max-width: 768px) {
.p-productsDetail__contact__head {
display: block;
}
}
.p-productsDetail__contact__head:not(:last-child) {
border-bottom: 1px dashed #d80c24;
padding: 0 0 20px;
}
.p-productsDetail__contact__ttl {
text-align: center;
}
.p-productsDetail__contact__ttl__inner {
font-size: 18px;
font-weight: 500;
line-height: 1.3;
letter-spacing: 0.075em;
}
@media screen and (max-width: 768px) {
.p-productsDetail__contact__ttl__inner {
font-size: 16px;
}
}
.p-productsDetail__contact__link {
text-align: center;
margin: 0 0 0 32px;
}
@media screen and (max-width: 768px) {
.p-productsDetail__contact__link {
margin: 20px 0 0;
}
}
.p-productsDetail__contact__link__button {
background: #d80c24;
border: 2px solid #d80c24;
min-width: 280px;
padding: 17px 60px;
position: relative;
display: inline-block;
-webkit-transition: background 0.4s ease;
transition: background 0.4s ease;
}
@media screen and (max-width: 768px) {
.p-productsDetail__contact__link__button {
padding: 17px 20px;
}
}
.p-productsDetail__contact__link__button::after {
content: "\e902";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 15px;
color: #fff;
position: absolute;
top: 50%;
right: 10px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (max-width: 768px) {
.p-productsDetail__contact__link__button::after {
font-size: 10px;
}
}
@media screen and (min-width: 769px) {
.p-productsDetail__contact__link__button:hover {
background: #fff;
}
.p-productsDetail__contact__link__button:hover::after {
color: #d80c24;
}
.p-productsDetail__contact__link__button:hover .p-productsDetail__contact__link__txt {
color: #d80c24;
}
}
.p-productsDetail__contact__link__txt {
font-size: 16px;
font-weight: 500;
color: #fff;
line-height: 1.2;
letter-spacing: 0.2em;
padding: 0 0 0 30px;
position: relative;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (max-width: 768px) {
.p-productsDetail__contact__link__txt {
font-size: 14px;
letter-spacing: 0.1em;
padding: 0 0 0 28px;
}
}
.p-productsDetail__contact__link__txt::after {
content: "\e908";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 13px;
position: absolute;
top: 50%;
left: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
.p-productsDetail__contact__link__txt::after {
font-size: 11px;
}
}
.p-productsDetail__contact__detail {
margin: 20px 0 0;
}
.p-productsDetail__contact__detail__tel {
font-size: 18px;
font-weight: 500;
line-height: 1.2;
letter-spacing: 0.075em;
text-align: center;
}
@media screen and (max-width: 768px) {
.p-productsDetail__contact__detail__tel {
font-size: 14px;
}
}
.p-productsDetail__contact__detail__tel:not(:first-child) {
margin-top: 1em;
}
.p-productsDetail__contact__detail__tel a {
text-decoration: underline;
}
@media screen and (min-width: 769px) {
.p-productsDetail__contact__detail__tel a:hover {
text-decoration: none;
}
}
.p-productsDetail__contact__detail__note {
font-size: 12px;
font-weight: 300;
line-height: 1.2;
text-align: center;
margin: 8px 0 0;
}
@media screen and (max-width: 768px) {
.p-productsDetail__contact__detail__note {
font-size: 13px;
margin: 5px 0 0;
}
}
.p-productsDetail__contact__fixed {
position: fixed;
top: 50%;
right: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
z-index: 90;
}
@media screen and (max-width: 768px) {
.p-productsDetail__contact__fixed {
left: 0;
top: auto;
bottom: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-transform: none;
transform: none;
}
}
.p-productsDetail__contact__fixed__link {
text-align: center;
-webkit-writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
text-orientation: upright;
background: #8f99a3;
padding: 30px 18px;
-webkit-transition: background 0.4s ease;
transition: background 0.4s ease;
z-index: 90;
display: block;
}
@media screen and (max-width: 768px) {
.p-productsDetail__contact__fixed__link {
-webkit-writing-mode: horizontal-tb;
-ms-writing-mode: lr-tb;
writing-mode: horizontal-tb;
text-align: center;
width: 100%;
padding: 10px 20px;
left: 0;
top: auto;
bottom: 0;
-webkit-transform: none;
transform: none;
}
}
@media screen and (min-width: 769px) {
.p-productsDetail__contact__fixed__link:not(:first-child) {
margin-top: 10px;
}
}
@media screen and (max-width: 768px) {
.p-productsDetail__contact__fixed__link:not(:first-child) {
border-left: 1px solid #d4d4d4;
}
}
@media screen and (min-width: 769px) {
.p-productsDetail__contact__fixed__link:hover {
background: #d80c24;
}
.p-productsDetail__contact__fixed__link:hover .p-productsDetail__contact__fixed__txt::after {
-webkit-transform: translateX(-50%) scale(0.6) translateY(5px);
transform: translateX(-50%) scale(0.6) translateY(5px);
}
}
.p-productsDetail__contact__fixed__txt {
font-size: 14px;
font-weight: 500;
color: #fff;
line-height: 1.36;
letter-spacing: 0.1em;
position: relative;
display: inline-block;
}
@media screen and (max-width: 768px) {
.p-productsDetail__contact__fixed__txt {
font-size: 12px;
}
}
.p-productsDetail__contact__fixed__txt.__contact {
padding: 22px 0 20px;
}
@media screen and (max-width: 768px) {
.p-productsDetail__contact__fixed__txt.__contact {
padding: 0 24px;
}
}
.p-productsDetail__contact__fixed__txt.__contact::before, .p-productsDetail__contact__fixed__txt.__contact::after {
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
position: absolute;
left: 50%;
}
@media screen and (max-width: 768px) {
.p-productsDetail__contact__fixed__txt.__contact::before, .p-productsDetail__contact__fixed__txt.__contact::after {
top: 50%;
left: auto;
}
}
.p-productsDetail__contact__fixed__txt.__contact::before {
content: "\e908";
font-size: 10px;
top: 0;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
@media screen and (max-width: 768px) {
.p-productsDetail__contact__fixed__txt.__contact::before {
top: 50%;
left: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
}
.p-productsDetail__contact__fixed__txt.__contact::after {
content: "\e907";
font-size: 10px;
bottom: 0;
-webkit-transform: translateX(-50%) scale(0.6);
transform: translateX(-50%) scale(0.6);
-webkit-transition: -webkit-transform 0.4s ease;
transition: -webkit-transform 0.4s ease;
transition: transform 0.4s ease;
transition: transform 0.4s ease, -webkit-transform 0.4s ease;
}
@media screen and (max-width: 768px) {
.p-productsDetail__contact__fixed__txt.__contact::after {
right: -5px;
-webkit-transform: translateY(-50%) scale(0.6);
transform: translateY(-50%) scale(0.6);
}
}
.p-productsDetail__bottomNav {
background: #f4f5f6;
padding: 50px 0 40px;
}
.p-productsDetail__bottomNav__inner {
margin: 0 auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
@media screen and (max-width: 768px) {
.p-productsDetail__bottomNav__inner {
display: block;
}
}
.p-productsDetail__bottomNav__ttl {
-webkit-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
}
@media screen and (max-width: 768px) {
.p-productsDetail__bottomNav__ttl {
font-size: 14px;
display: inline-block;
}
}
.p-productsDetail__bottomNav__ttl__link {
font-size: 16px;
font-weight: 500;
line-height: 1.2;
padding: 5px 0;
letter-spacing: 0.06em;
border-bottom: 1px solid #eb1c24;
display: block;
-webkit-transition: opacity 0.4s ease;
transition: opacity 0.4s ease;
}
@media screen and (min-width: 769px) {
.p-productsDetail__bottomNav__ttl__link:hover {
opacity: 0.6;
}
}
.p-productsDetail__bottomNav__list {
margin: 0 0 0 20px;
-webkit-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
-webkit-column-count: 2;
-moz-column-count: 2;
column-count: 2;
}
@media screen and (max-width: 768px) {
.p-productsDetail__bottomNav__list {
-webkit-column-count: 2;
-moz-column-count: 2;
column-count: 2;
margin: 24px auto 0;
}
}
.p-productsDetail__bottomNav__list__item {
margin: 0 0 10px;
page-break-inside: avoid;
-webkit-column-break-inside: avoid;
-moz-column-break-inside: avoid;
break-inside: avoid;
}
.p-productsDetail__bottomNav__list__link {
font-size: 16px;
font-weight: 300;
line-height: 1.2;
padding: 5px 0 5px 0.5em;
position: relative;
display: inline-block;
-webkit-transition: opacity 0.4s ease;
transition: opacity 0.4s ease;
}
@media screen and (max-width: 768px) {
.p-productsDetail__bottomNav__list__link {
font-size: 14px;
}
}
@media screen and (min-width: 769px) {
.p-productsDetail__bottomNav__list__link:hover {
opacity: 0.6;
}
}
.p-productsDetail__bottomNav__list__link::before {
content: "-";
position: absolute;
left: 0;
}
.p-productsDetail__bottomNav__list__head {
font-size: 16px;
font-weight: 300;
line-height: 1.2;
padding: 5px 0;
position: relative;
display: inline-block;
-webkit-transition: opacity 0.4s ease;
transition: opacity 0.4s ease;
}
@media screen and (max-width: 768px) {
.p-productsDetail__bottomNav__list__head {
font-size: 14px;
}
}
.p-productsDetail__bottomNav__listSub {
margin: 0 0 0 0.5em;
}
.p-productsDetail__bottomNav__listSub__item {
page-break-inside: avoid;
-webkit-column-break-inside: avoid;
-moz-column-break-inside: avoid;
break-inside: avoid;
}
.p-productsDetail__bottomNav__listSub__link {
font-size: 14px;
font-weight: 300;
line-height: 1.2;
padding: 5px 0 5px 0.5em;
position: relative;
display: inline-block;
-webkit-transition: opacity 0.4s ease;
transition: opacity 0.4s ease;
}
@media screen and (max-width: 768px) {
.p-productsDetail__bottomNav__listSub__link {
font-size: 12px;
}
}
@media screen and (min-width: 769px) {
.p-productsDetail__bottomNav__listSub__link:hover {
opacity: 0.6;
}
}
.p-productsDetail__bottomNav__listSub__link::before {
content: "-";
position: absolute;
left: 0;
}
@media screen and (min-width: 769px) {
.lang-en .p-productsDetail__contact__fixed__link {
-webkit-writing-mode: horizontal-tb;
-ms-writing-mode: lr-tb;
writing-mode: horizontal-tb;
padding: 15px;
}
}
.lang-en .p-productsDetail__contact__fixed__txt {
padding-top: 13px;
}
@media screen and (max-width: 768px) {
.lang-en .p-productsDetail__contact__fixed__txt {
padding-top: 0;
}
}
.lang-en .p-productsDetail__contact__ttl__department {
text-align: left;
display: block;
}
@media screen and (min-width: 769px) {
.lang-zh-hans .p-productsDetail__contact__fixed__link {
-webkit-writing-mode: horizontal-tb;
-ms-writing-mode: lr-tb;
writing-mode: horizontal-tb;
padding: 15px;
}
}
.lang-zh-hans .p-productsDetail__contact__fixed__txt {
padding-top: 13px;
padding-bottom: 0;
}
@media screen and (max-width: 768px) {
.lang-zh-hans .p-productsDetail__contact__fixed__txt {
padding-top: 0;
padding-right: 0;
}
}
.lang-zh-hans .p-productsDetail__contact__fixed__txt::after {
display: none;
}
.c-products__main {
padding: 80px 0 180px;
}
@media screen and (max-width: 768px) {
.c-products__main {
padding: 40px 0 80px;
}
}
.c-products__main + .c-products__main {
padding-top: 0;
}
.c-products__content:not(:first-child) {
margin: 80px 0 0;
}
@media screen and (max-width: 768px) {
.c-products__content:not(:first-child) {
margin: 40px 0 0;
}
}
.c-text-align-left {
text-align: left;
}
.c-font-weight-700 {
font-weight: 700;
}
.c-vertical-align-bottom {
vertical-align: bottom;
}
.c-productsIndex__list {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.c-productsIndex__list {
display: block;
}
}
.c-productsIndex__list__item {
-webkit-box-flex: 0;
-ms-flex: 0 0 32%;
flex: 0 0 32%;
-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
-webkit-transition: -webkit-box-shadow 0.4s ease;
transition: -webkit-box-shadow 0.4s ease;
transition: box-shadow 0.4s ease;
transition: box-shadow 0.4s ease, -webkit-box-shadow 0.4s ease;
position: relative;
}
@media screen and (min-width: 769px) {
.c-productsIndex__list__item:not(:nth-child(3n+1)) {
margin-left: 2%;
}
.c-productsIndex__list__item:nth-child(n+4) {
margin-top: 2%;
}
}
@media screen and (max-width: 768px) {
.c-productsIndex__list__item:not(:first-child) {
margin-top: 30px;
}
}
@media screen and (min-width: 769px) {
.c-productsIndex__list__item:hover {
-webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
}
.c-productsIndex__list__item:hover .c-productsIndex__list__fig__img {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
.c-productsIndex__list__item:hover .c-productsIndex__list__ttl__main {
color: #d80c24;
}
.c-productsIndex__list__item:hover::after {
border-width: 0;
}
}
.c-productsIndex__list__item::after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 15px 15px;
border-color: transparent transparent #d80c24 transparent;
position: absolute;
right: 0;
bottom: 0;
-webkit-transition: border-width 0.4s ease;
transition: border-width 0.4s ease;
}
.c-productsIndex__list__link {
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.c-productsIndex__list__ttl {
border-bottom: 1px solid #d4d4d4;
margin: 0 20px;
padding: 15px 0;
position: relative;
-webkit-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
@media screen and (max-width: 768px) {
.c-productsIndex__list__ttl {
padding: 20px 0 15px;
}
}
.c-productsIndex__list__ttl::after {
content: "";
background: #d80c24;
width: 16px;
height: 1px;
position: absolute;
bottom: -1px;
left: 0;
}
.c-productsIndex__list__ttl__main {
font-size: 18px;
font-weight: 700;
line-height: 1.2;
letter-spacing: 0.1em;
display: block;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
.c-productsIndex__list__ttl__main::first-letter {
color: #d80c24;
}
.c-productsIndex__list__fig {
max-width: 100%;
height: 153px;
margin: 20px 20px 0;
position: relative;
overflow: hidden;
-webkit-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
display: block;
}
.c-productsIndex__list__fig__img {
width: auto;
max-width: none;
height: 100%;
margin: auto;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
-webkit-transition: -webkit-transform 0.4s ease;
transition: -webkit-transform 0.4s ease;
transition: transform 0.4s ease;
transition: transform 0.4s ease, -webkit-transform 0.4s ease;
}
.c-productsIndex__list__txt {
background: #f4f5f6;
height: 100%;
margin: 20px 0 0;
padding: 20px;
position: relative;
bottom: 0;
}
.c-productsIndex__list__txt__item {
font-size: 16px;
line-height: 1.63;
letter-spacing: 0.16em;
}
.c-productsCtg__hero__cont {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
}
@media screen and (max-width: 768px) {
.c-productsCtg__hero__cont {
max-width: 500px;
margin: 0 auto;
display: block;
}
}
.c-productsCtg__hero__fig {
height: 200px;
margin: 0 0 0 6%;
-webkit-box-flex: 0;
-ms-flex: 0 0 37%;
flex: 0 0 37%;
overflow: hidden;
}
@media screen and (max-width: 768px) {
.c-productsCtg__hero__fig {
height: 150px;
margin: 0 auto 16px;
}
}
.c-productsCtg__hero__fig__img {
width: auto;
max-width: none;
height: 100%;
margin: auto;
display: block;
}
.c-productsCtg__hero__detail {
-webkit-box-flex: 0;
-ms-flex: 0 0 57%;
flex: 0 0 57%;
}
.c-productsCtg__hero__detail__ttl {
padding: 0 0 20px;
border-bottom: 1px solid #d4d4d4;
position: relative;
}
@media screen and (max-width: 768px) {
.c-productsCtg__hero__detail__ttl {
margin: 0 0 8px;
}
}
.c-productsCtg__hero__detail__ttl::after {
content: "";
background: #d80c24;
width: 30px;
height: 1px;
position: absolute;
bottom: -1px;
left: 0;
}
.c-productsCtg__hero__detail__ttl__main {
font-size: 36px;
font-weight: 700;
line-height: 1.2;
letter-spacing: 0.13em;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsCtg__hero__detail__ttl__main {
font-size: 22px;
}
}
.c-productsCtg__hero__detail__ttl__main::first-letter {
color: #d80c24;
}
.c-productsCtg__hero__detail__txt {
margin: 32px 0 0;
}
@media screen and (max-width: 768px) {
.c-productsCtg__hero__detail__txt {
margin: 16px 0 0;
}
}
.c-productsCtg__hero__detail__txt__item {
font-size: 18px;
line-height: 1.78;
}
@media screen and (max-width: 768px) {
.c-productsCtg__hero__detail__txt__item {
font-size: 16px;
}
}
.c-productsCtg__hero__detail__list {
margin: 32px 0 0;
}
@media screen and (max-width: 768px) {
.c-productsCtg__hero__detail__list {
margin: 16px 0 0;
}
}
.c-productsCtg__hero__detail__list__item:not(:first-child) {
margin-top: 10px;
}
@media screen and (max-width: 768px) {
.c-productsCtg__hero__detail__list__item:not(:first-child) {
margin-top: 5px;
}
}
.c-productsCtg__hero__detail__list__txt {
font-size: 18px;
line-height: 1.78;
padding-left: 1em;
position: relative;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsCtg__hero__detail__list__txt {
font-size: 16px;
line-height: 1.6;
}
}
.c-productsCtg__hero__detail__list__txt::before {
content: "";
background: #d80c24;
border-radius: 100%;
width: 8px;
height: 8px;
position: absolute;
top: 13px;
left: 3px;
}
@media screen and (max-width: 768px) {
.c-productsCtg__hero__detail__list__txt::before {
width: 6px;
height: 6px;
top: 10px;
}
}
.c-productsLinkList {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.c-productsLinkList {
display: block;
}
}
.c-productsLinkList:not(:first-child) {
margin-top: 30px;
}
@media screen and (max-width: 768px) {
.c-productsLinkList:not(:first-child) {
margin-top: 20px;
}
}
.c-productsLinkList__item {
background: #f9f5f2;
padding: 10px;
}
@media screen and (max-width: 768px) {
.c-productsLinkList__item:not(:first-child) {
margin-top: 20px;
}
}
@media screen and (min-width: 769px) {
.c-productsLinkList__item--col--2 {
-webkit-box-flex: 0;
-ms-flex: 0 0 48%;
flex: 0 0 48%;
}
.c-productsLinkList__item--col--2:nth-child(even) {
margin-left: 4%;
}
.c-productsLinkList__item--col--2:nth-child(n+3) {
margin-top: 32px;
}
}
@media screen and (min-width: 769px) {
.c-productsLinkList__item--col--3 {
-webkit-box-flex: 0;
-ms-flex: 0 0 32%;
flex: 0 0 32%;
}
.c-productsLinkList__item--col--3:not(:nth-child(3n+1)) {
margin-left: 2%;
}
.c-productsLinkList__item--col--3:nth-child(n+4) {
margin-top: 32px;
}
}
.c-productsLinkList__link {
color: #fff;
line-height: 1.2;
text-align: center;
background: #d80c24;
padding: 10px 20px;
display: block;
position: relative;
-webkit-transition: opacity 0.4s ease;
transition: opacity 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsLinkList__link {
padding: 10px 30px;
}
}
@media screen and (min-width: 769px) {
.c-productsLinkList__link:hover {
opacity: 0.6;
}
}
.c-productsLinkList__link::before {
content: "\e902";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 15px;
position: absolute;
top: 50%;
right: 10px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
.c-productsLinkList__link::before {
font-size: 12px;
right: 10px;
}
}
.c-productsLinkList__link::after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 15px 15px;
border-color: transparent transparent #f9f5f2 transparent;
position: absolute;
right: 0;
bottom: 0;
}
@media screen and (max-width: 768px) {
.c-productsLinkList__link::after {
border-width: 0 0 8px 8px;
}
}
.c-productsLinkList__link__sub {
font-size: 13px;
font-weight: 500;
letter-spacing: 0.05em;
width: 100%;
margin: 0 0 3px;
display: inline-block;
}
@media screen and (max-width: 768px) {
.c-productsLinkList__link__sub {
font-size: 12px;
margin: 0 0 2px;
}
}
.c-productsLinkList__link__main {
font-size: 19px;
font-weight: 700;
letter-spacing: 0.12em;
width: 100%;
display: inline-block;
}
@media screen and (max-width: 768px) {
.c-productsLinkList__link__main {
font-size: 18px;
}
}
.c-productsLinkList__link__main:only-child {
padding: 11px 0;
}
@media screen and (max-width: 768px) {
.c-productsLinkList__link__main:only-child {
padding: 5px 0;
}
}
.c-productsLinkList__link__main.__narrow {
padding: 0;
}
.c-productsLinkList__txt {
margin: 2px 0 0;
padding: 10px;
}
.c-productsLinkList__txt__p {
font-size: 16px;
line-height: 1.69;
letter-spacing: 0.16em;
}
@media screen and (max-width: 768px) {
.c-productsLinkList__txt__p {
font-size: 14px;
}
}
.c-productsLinkList02 {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.c-productsLinkList02 {
display: block;
}
}
.c-productsLinkList02:not(:first-child) {
margin-top: 30px;
}
@media screen and (max-width: 768px) {
.c-productsLinkList02:not(:first-child) {
margin-top: 20px;
}
}
@media screen and (max-width: 768px) {
.c-productsLinkList02__item:not(:first-child) {
margin-top: 20px;
}
}
.c-productsLinkList02__item--col--3 {
-webkit-box-flex: 0;
-ms-flex: 0 0 32%;
flex: 0 0 32%;
}
@media screen and (min-width: 769px) {
.c-productsLinkList02__item--col--3:not(:nth-child(3n+1)) {
margin-left: 2%;
}
.c-productsLinkList02__item--col--3:nth-child(n+4) {
margin-top: 2%;
}
}
.c-productsLinkList02__link {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
height: 100%;
}
.c-productsLinkList02__link::after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 15px 15px;
border-color: transparent transparent #fff transparent;
position: absolute;
right: 0;
bottom: 0;
}
@media screen and (max-width: 768px) {
.c-productsLinkList02__link::after {
border-width: 0 0 8px 8px;
}
}
@media screen and (min-width: 769px) {
.c-productsLinkList02__link:hover .c-productsLinkList02__fig__img {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
.c-productsLinkList02__link:hover .c-productsLinkList02__ttl::after {
right: 5px;
}
}
.c-productsLinkList02__fig {
background: #f4f5f6;
height: 0;
padding-top: 47%;
position: relative;
overflow: hidden;
}
.c-productsLinkList02__fig__img {
width: auto;
max-width: 100%;
height: 100%;
margin: auto;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
-webkit-transition: -webkit-transform 0.4s ease;
transition: -webkit-transform 0.4s ease;
transition: transform 0.4s ease;
transition: transform 0.4s ease, -webkit-transform 0.4s ease;
}
.c-productsLinkList02__ttl {
color: #fff;
text-align: center;
background: #d80c24;
padding: 14px 20px;
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
position: relative;
}
.c-productsLinkList02__ttl::after {
content: "\e902";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 14px;
position: absolute;
top: 50%;
right: 10px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: right 0.4s ease;
transition: right 0.4s ease;
}
.c-productsLinkList02__ttl__sub {
font-size: 13px;
font-weight: 500;
letter-spacing: 0.05em;
width: 100%;
margin: 0 0 5px;
display: inline-block;
}
@media screen and (max-width: 768px) {
.c-productsLinkList02__ttl__sub {
font-size: 12px;
margin: 0 0 2px;
}
}
.c-productsLinkList02__ttl__main {
font-size: 21px;
font-weight: 700;
line-height: 1.2;
letter-spacing: 0.12em;
width: 100%;
display: inline-block;
}
@media screen and (max-width: 768px) {
.c-productsLinkList02__ttl__main {
font-size: 18px;
}
}
.c-productsLinkList02__ttl__main:only-child {
padding: 11px 0;
}
@media screen and (max-width: 768px) {
.c-productsLinkList02__ttl__main:only-child {
padding: 5px 0;
}
}
.c-productsLinkList03 {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
@media screen and (max-width: 768px) {
.c-productsLinkList03 {
display: block;
}
}
.c-productsLinkList03__item {
background: #f9f5f2;
}
@media screen and (max-width: 768px) {
.c-productsLinkList03__item:not(:first-child) {
margin-top: 20px;
}
}
.c-productsLinkList03__item--col--3 {
-webkit-box-flex: 0;
-ms-flex: 0 0 32%;
flex: 0 0 32%;
}
@media screen and (min-width: 769px) {
.c-productsLinkList03__item--col--3:not(:nth-child(3n+1)) {
margin-left: 2%;
}
.c-productsLinkList03__item--col--3:nth-child(n+4) {
margin-top: 2%;
}
}
.c-productsLinkList03__head {
background: #d80c24;
padding: 20px 16px;
display: block;
}
@media screen and (min-width: 769px) {
a.c-productsLinkList03__head:hover .c-productsLinkList03__ttl::after {
right: 0;
}
}
span.c-productsLinkList03__head .c-productsLinkList03__ttl::after {
content: "";
}
.c-productsLinkList03__head__top {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.c-productsLinkList03__sign {
background: #fff;
border-radius: 100%;
width: 70px;
height: 70px;
-webkit-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
margin: 0 5px 0 0;
position: relative;
}
@media screen and (max-width: 768px) {
.c-productsLinkList03__sign {
height: 80px;
}
}
.c-productsLinkList03__sign__img {
width: 80%;
height: 80%;
-o-object-fit: contain;
object-fit: contain;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.c-productsLinkList03__ttl {
border-top: 1px solid #fff;
border-bottom: 1px solid #fff;
padding: 10px 20px;
-webkit-box-flex: 1;
-ms-flex: 1 0 auto;
flex: 1 0 auto;
position: relative;
}
.c-productsLinkList03__ttl::after {
content: "\e902";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 12px;
color: #fff;
position: absolute;
top: 50%;
right: 5px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: right 0.4s ease;
transition: right 0.4s ease;
}
.c-productsLinkList03__ttl__main {
font-size: 20px;
font-weight: 700;
color: #fff;
line-height: 1.2;
text-align: center;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsLinkList03__ttl__main {
font-size: 18px;
}
}
.c-productsLinkList03__lead {
margin: 10px 0 0;
}
.c-productsLinkList03__lead__txt {
font-size: 16px;
color: #fff;
line-height: 1.38;
text-align: center;
}
@media screen and (max-width: 768px) {
.c-productsLinkList03__lead__txt {
font-size: 14px;
}
}
.c-productsLinkList03__cont {
padding: 20px;
}
.c-productsLinkList03__list__item:not(:first-child) {
margin-top: 8px;
}
.c-productsLinkList03__list__link {
background: #fff;
border: 1px solid #d80c24;
padding: 18px;
position: relative;
display: block;
-webkit-transition: background 0.4s ease;
transition: background 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsLinkList03__list__link {
padding: 15px;
}
}
.c-productsLinkList03__list__link.__narrow {
padding: 9px 18px;
}
.c-productsLinkList03__list__link::after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 15px 15px;
border-color: transparent transparent #d80c24 transparent;
position: absolute;
right: 0;
bottom: 0;
}
.c-productsLinkList03__list__link:hover {
background: #d80c24;
}
.c-productsLinkList03__list__link:hover::before {
color: #fff;
}
.c-productsLinkList03__list__link:hover .c-productsLinkList03__list__txt__sub,
.c-productsLinkList03__list__link:hover .c-productsLinkList03__list__txt__main {
color: #fff;
}
.c-productsLinkList03__list__txt {
text-align: center;
}
.c-productsLinkList03__list__txt__main {
font-size: 15px;
font-weight: 700;
color: #d80c24;
line-height: 1.2;
display: block;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
.c-productsLinkList04 {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.c-productsLinkList04 {
display: block;
}
}
.c-productsLinkList04__item {
border: 2px solid #d80c24;
}
@media screen and (max-width: 768px) {
.c-productsLinkList04__item:not(:first-child) {
margin-top: 2%;
}
}
.c-productsLinkList04__item--col--2 {
-webkit-box-flex: 0;
-ms-flex: 0 0 49%;
flex: 0 0 49%;
}
@media screen and (min-width: 769px) {
.c-productsLinkList04__item--col--2:nth-child(even) {
margin-left: 2%;
}
.c-productsLinkList04__item--col--2:nth-child(n+3) {
margin-top: 2%;
}
}
.c-productsLinkList04__item--col--3 {
-webkit-box-flex: 0;
-ms-flex: 0 0 32%;
flex: 0 0 32%;
}
@media screen and (min-width: 769px) {
.c-productsLinkList04__item--col--3:not(:nth-child(3n+1)) {
margin-left: 2%;
}
.c-productsLinkList04__item--col--3:nth-child(n+4) {
margin-top: 2%;
}
}
.c-productsLinkList04__link {
color: #d80c24;
font-weight: 500;
text-align: center;
line-height: 1.2;
letter-spacing: 0.05em;
width: 100%;
height: 100%;
padding: 10px 20px;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-transition: color 0.4s ease, background 0.4s ease;
transition: color 0.4s ease, background 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsLinkList04__link {
padding: 10px 15px;
}
}
.c-productsLinkList04__link:before, .c-productsLinkList04__link::after {
content: "";
width: 0;
height: 0;
border-style: solid;
position: absolute;
}
.c-productsLinkList04__link::before {
border-color: transparent transparent #d80c24 transparent;
border-width: 0 0 15px 15px;
right: 0;
bottom: 0;
}
@media screen and (max-width: 768px) {
.c-productsLinkList04__link::before {
border-width: 0 0 8px 8px;
}
}
.c-productsLinkList04__link::after {
border-color: transparent transparent #fff transparent;
border-width: 0 0 16px 16px;
right: -2px;
bottom: -2px;
}
@media screen and (max-width: 768px) {
.c-productsLinkList04__link::after {
border-width: 0 0 9px 9px;
}
}
@media screen and (min-width: 769px) {
.c-productsLinkList04__link:hover {
color: #fff;
background: #d80c24;
}
}
.c-productsLinkList04__link__inner {
width: 100%;
position: relative;
}
.c-productsLinkList04__link__inner::after {
content: "\e902";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 15px;
position: absolute;
top: 50%;
left: 100%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
.c-productsLinkList04__link__inner::after {
font-size: 12px;
}
}
.c-productsLinkList04__link__sub {
font-size: 14px;
letter-spacing: 0;
margin: 0 0 3px;
display: inline-block;
}
@media screen and (max-width: 768px) {
.c-productsLinkList04__link__sub {
font-size: 11px;
}
}
.c-productsLinkList04__link__main {
font-size: 19px;
font-weight: 700;
width: 100%;
display: inline-block;
}
@media screen and (max-width: 768px) {
.c-productsLinkList04__link__main {
font-size: 18px;
}
}
.c-productsLinkList04__link__main:only-child {
padding: 11px 0;
}
@media screen and (max-width: 768px) {
.c-productsLinkList04__link__main:only-child {
padding: 5px 0;
}
}
.c-productsCatalog {
background: #8f99a3;
padding: 40px 0;
}
.c-productsCatalog__inner {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
@media screen and (max-width: 768px) {
.c-productsCatalog__inner {
display: block;
}
}
.c-productsCatalog__link {
text-align: center;
background: #fff;
width: 100%;
max-width: 600px;
padding: 18px;
position: relative;
display: block;
-webkit-transition: background 0.4s ease;
transition: background 0.4s ease;
}
@media screen and (min-width: 769px) {
.c-productsCatalog__link:hover {
background: #d80c24;
}
.c-productsCatalog__link:hover .c-productsCatalog__link__txt {
color: #fff;
}
}
.c-productsCatalog__link::after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 15px 15px;
border-color: transparent transparent #d80c24 transparent;
position: absolute;
right: 0;
bottom: 0;
-webkit-transition: border-width 0.4s ease;
transition: border-width 0.4s ease;
}
.c-productsCatalog__link:not(:first-child) {
margin-left: 20px;
}
@media screen and (max-width: 768px) {
.c-productsCatalog__link:not(:first-child) {
margin: 10px 0 0;
}
}
.c-productsCatalog__link__txt {
font-size: 22px;
font-weight: 700;
color: #d80c24;
line-height: 1.3;
letter-spacing: 0.12em;
padding: 0 20px 0 50px;
display: inline-block;
position: relative;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsCatalog__link__txt {
font-size: 16px;
padding: 0 15px 0 30px;
}
}
.c-productsCatalog__link__txt::before {
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 29px;
position: absolute;
top: 50%;
left: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
.c-productsCatalog__link__txt::before {
font-size: 18px;
}
}
.c-productsCatalog__link__txt.__catalog::before {
content: "\e909";
}
.c-productsCatalog__link__txt.__faq::before {
content: "\e90a";
}
.c-productsCatalog__link__txt::after {
content: "\e902";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 16px;
position: absolute;
top: 50%;
right: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
.c-productsCatalog__link__txt::after {
font-size: 12px;
}
}
.c-productsPickup01 {
background: #f4f5f6;
margin: 80px 0 0;
}
@media screen and (max-width: 768px) {
.c-productsPickup01 {
margin: 24px 0 0;
}
}
.c-productsPickup01__ttl {
text-align: center;
border-bottom: 2px solid #d80c24;
padding: 18px 20px;
}
.c-productsPickup01__ttl__main {
font-size: 24px;
font-weight: 700;
color: #d80c24;
line-height: 1.2;
letter-spacing: 0.2em;
}
@media screen and (max-width: 768px) {
.c-productsPickup01__ttl__main {
font-size: 18px;
letter-spacing: 0.1em;
}
}
.c-productsPickup01__cont {
padding: 40px 40px;
}
@media screen and (max-width: 768px) {
.c-productsPickup01__cont {
padding: 20px;
}
}
.c-productsPickup01__row {
padding: 0 40px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
@media screen and (max-width: 768px) {
.c-productsPickup01__row {
padding: 0;
display: block;
}
}
@media screen and (max-width: 768px) {
.c-productsPickup01__fig {
margin: 0 0 10px;
}
}
@media screen and (min-width: 769px) {
.c-productsPickup01__fig--row {
-webkit-box-flex: 0;
-ms-flex: 0 0 38%;
flex: 0 0 38%;
margin-right: 7%;
}
}
.c-productsPickup01__detail--row {
-webkit-box-flex: 0;
-ms-flex: 0 0 55%;
flex: 0 0 55%;
}
.c-productsPickup01__detail__txt {
font-size: 18px;
line-height: 1.78;
letter-spacing: 0.08em;
}
@media screen and (max-width: 768px) {
.c-productsPickup01__detail__txt {
font-size: 14px;
}
}
.c-productsPickup01__detail__link {
margin: 24px 0 0;
}
@media screen and (max-width: 768px) {
.c-productsPickup01__detail__link {
margin: 12px 0 0;
}
}
.c-productsPickup01__detail__link__btn {
text-align: center;
background: #1dafe6;
padding: 21px;
display: block;
-webkit-transition: background 0.4s ease;
transition: background 0.4s ease;
}
@media screen and (min-width: 769px) {
.c-productsPickup01__detail__link__btn:hover {
background: rgb(96.8, 199, 237.5);
}
}
.c-productsPickup01__detial__link__txt {
font-size: 18px;
font-weight: 700;
color: #fff;
padding: 0 50px 0 70px;
display: inline-block;
position: relative;
}
@media screen and (max-width: 768px) {
.c-productsPickup01__detial__link__txt {
font-size: 16px;
padding: 0 20px 0 50px;
}
}
.c-productsPickup01__detial__link__txt::before {
content: "\e90b";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 39px;
position: absolute;
top: 50%;
left: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
.c-productsPickup01__detial__link__txt::before {
font-size: 30px;
}
}
.c-productsPickup01__detial__link__txt::after {
content: "\e902";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 15px;
position: absolute;
top: 50%;
right: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
.c-productsPickup01__detial__link__txt::after {
font-size: 12px;
}
}
.c-productsPickup01__list {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.c-productsPickup01__list {
display: block;
}
}
.c-productsPickup01__list__item {
background: #fff;
padding: 10px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
@media screen and (max-width: 768px) {
.c-productsPickup01__list__item {
display: block;
}
.c-productsPickup01__list__item:not(:first-child) {
margin-top: 20px;
}
}
.c-productsPickup01__list__item--col--3 {
-webkit-box-flex: 0;
-ms-flex: 0 0 32%;
flex: 0 0 32%;
}
@media screen and (min-width: 769px) {
.c-productsPickup01__list__item--col--3:not(:nth-child(3n+1)) {
margin-left: 2%;
}
.c-productsPickup01__list__item--col--3:nth-child(n+4) {
margin-top: 2%;
}
}
.c-productsPickup01__list__item--split {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.c-productsPickup01__list__row {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
@media screen and (max-width: 768px) {
.c-productsPickup01__list__row {
display: block;
}
}
.c-productsPickup01__list__row__fig {
text-align: center;
-webkit-box-flex: 0;
-ms-flex: 0 0 44%;
flex: 0 0 44%;
}
.c-productsPickup01__list__row__col {
margin: 0 0 0 2%;
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
@media screen and (max-width: 768px) {
.c-productsPickup01__list__row__col {
margin: 10px 0 0;
}
}
.c-productsPickup01__list__fig {
text-align: center;
}
.c-productsPickup01__list__ttl {
border-bottom: 1px solid #d4d4d4;
padding: 0 0 10px;
}
.c-productsPickup01__list__ttl:not(:first-child) {
margin: 10px 0 0;
}
.c-productsPickup01__list__ttl__main {
font-size: 18px;
font-weight: 700;
}
.c-productsPickup01__list__txt {
font-size: 16px;
line-height: 1.69;
margin: 10px 0;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsPickup01__list__txt {
font-size: 14px;
margin: 10px 0 0;
}
}
.c-productsPickup01__list__link {
font-size: 18px;
font-weight: 700;
color: #fff;
text-align: center;
background: #1dafe6;
margin: auto 0 0;
padding: 21px 20px;
position: relative;
display: block;
-webkit-transition: background 0.4s ease;
transition: background 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsPickup01__list__link {
font-size: 16px;
margin: 10px 0 0;
padding: 16px 20px;
}
}
.c-productsPickup01__list__link::after {
content: "\e902";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 13px;
position: absolute;
top: 50%;
right: 10px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
.c-productsPickup01__list__link::after {
font-size: 10px;
}
}
@media screen and (min-width: 769px) {
.c-productsPickup01__list__link:hover {
background: rgb(142, 215, 242.5);
}
}
.c-productsPickup02 {
border: 2px solid #8f99a3;
margin: 80px 0 0;
}
@media screen and (max-width: 768px) {
.c-productsPickup02 {
margin: 24px 0 0;
}
}
.c-productsPickup02__ttl {
text-align: center;
background: #8f99a3;
padding: 12px;
}
.c-productsPickup02__ttl__main {
font-size: 22px;
font-weight: 700;
color: #fff;
line-height: 1.2;
letter-spacing: 0.2em;
}
@media screen and (max-width: 768px) {
.c-productsPickup02__ttl__main {
font-size: 18px;
letter-spacing: 0.1em;
}
}
.c-productsPickup02__cont {
padding: 40px 40px 50px;
}
@media screen and (max-width: 768px) {
.c-productsPickup02__cont {
padding: 20px 20px 30px;
}
}
.c-productsPickup02__fig {
width: 100%;
margin: auto;
}
.c-productsLink__button:not(:first-child) {
margin-top: 20px;
}
.c-productsLink__button__item {
text-align: center;
border: 1px solid #d80c24;
padding: 32px;
display: block;
-webkit-transition: background 0.4s ease;
transition: background 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsLink__button__item {
padding: 20px;
}
}
@media screen and (min-width: 769px) {
.c-productsLink__button__item:hover {
background: #d80c24;
}
.c-productsLink__button__item:hover .c-productsLink__button__txt {
color: #fff;
}
}
.c-productsLink__button__txt {
font-size: 18px;
font-weight: 700;
color: #d80c24;
padding: 0 50px;
display: inline-block;
position: relative;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsLink__button__txt {
font-size: 16px;
padding: 0 40px;
}
}
.c-productsLink__button__txt.__faq::before {
content: "\e90a";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 35px;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
left: 0;
}
@media screen and (max-width: 768px) {
.c-productsLink__button__txt.__faq::before {
font-size: 25px;
}
}
.c-productsLink__button__txt::after {
content: "\e902";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 14px;
position: absolute;
top: 50%;
right: 0;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
.c-productsLink__button__txt::after {
font-size: 12px;
}
}
.c-productsHead {
background: #f4f5f6;
padding: 10px 10px 10px 50px;
}
@media screen and (max-width: 768px) {
.c-productsHead {
max-width: 500px;
margin: 0 auto;
padding: 20px 16px;
}
}
.c-productsHead:not(:first-child) {
margin-top: 140px;
}
@media screen and (max-width: 768px) {
.c-productsHead:not(:first-child) {
margin-top: 70px;
}
}
.c-productsHead__inner {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
@media screen and (max-width: 768px) {
.c-productsHead__inner {
display: block;
}
}
.c-productsHead__col {
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
@media screen and (min-width: 769px) {
.c-productsHead__col {
padding: 30px 0;
}
}
@media screen and (max-width: 768px) {
.c-productsHead__col:not(:first-child) {
margin: 18px 0 0;
}
}
@media screen and (min-width: 769px) {
.c-productsHead__col:only-child {
padding: 30px 40px 30px 0;
}
}
.c-productsHead__ttl {
border-left: 3px solid #d80c24;
padding-left: 1em;
}
@media screen and (max-width: 768px) {
.c-productsHead__ttl {
border-width: 2px;
padding-left: 0.6em;
}
}
.c-productsHead__ttl:only-child {
margin-top: 35px;
margin-bottom: 35px;
}
@media screen and (max-width: 768px) {
.c-productsHead__ttl:only-child {
margin-top: 10px;
margin-bottom: 10px;
}
}
.c-productsHead__ttl__sub {
font-size: 18px;
font-weight: 500;
line-height: 1.2;
letter-spacing: 0.1em;
vertical-align: middle;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsHead__ttl__sub {
font-size: 12px;
letter-spacing: 0.05em;
margin: 0 0 2px;
}
}
.c-productsHead__ttl__sub:not(:first-child) {
margin-top: 5px;
}
@media screen and (max-width: 768px) {
.c-productsHead__ttl__sub:not(:first-child) {
margin-top: 2px;
}
}
.c-productsHead__ttl__main {
font-size: 32px;
font-weight: 700;
line-height: 1.2;
letter-spacing: 0.05em;
vertical-align: middle;
display: inline-block;
}
@media screen and (max-width: 768px) {
.c-productsHead__ttl__main {
font-size: 18px;
}
}
.c-productsHead__ttl__main:not(:first-child) {
margin-top: 5px;
}
@media screen and (max-width: 768px) {
.c-productsHead__ttl__main:not(:first-child) {
margin-top: 2px;
}
}
.c-productsHead__cont {
border-top: 1px solid #d4d4d4;
margin: 12px 0 0;
padding: 15px 0 0;
position: relative;
}
.c-productsHead__cont::after {
content: "";
background: #d80c24;
width: 30px;
height: 1px;
position: absolute;
left: 0;
top: -1px;
}
.c-productsHead__txt {
font-size: 16px;
line-height: 1.6;
letter-spacing: 0.12em;
}
@media screen and (max-width: 768px) {
.c-productsHead__txt {
font-size: 14px;
line-height: 1.5;
letter-spacing: 0.06em;
padding: 0;
}
}
.c-productsHead__txt:not(:first-child) {
margin-top: 15px;
}
@media screen and (max-width: 768px) {
.c-productsHead__txt:not(:first-child) {
margin-top: 10px;
}
}
.c-productsHead__attention:not(:first-child) {
margin-top: 20px;
}
@media screen and (max-width: 768px) {
.c-productsHead__attention:not(:first-child) {
margin-top: 10px;
}
}
.c-productsHead__attention__txt {
font-size: 14px;
color: #eb1c24;
line-height: 1.2;
letter-spacing: 0.12em;
padding: 0 0 0 20px;
position: relative;
}
@media screen and (max-width: 768px) {
.c-productsHead__attention__txt {
font-size: 12px;
letter-spacing: 0.06em;
padding: 0 0 0 16px;
}
}
.c-productsHead__attention__txt::before {
content: "";
background: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/img/common/icon-attention.png) no-repeat center center/contain;
width: 16px;
height: 14px;
position: absolute;
top: 1px;
left: 0;
}
@media screen and (max-width: 768px) {
.c-productsHead__attention__txt::before {
width: 13px;
height: 13px;
top: 2px;
}
}
.c-productsHead__attention__txt a {
color: inherit;
text-decoration: underline;
}
@media screen and (min-width: 769px) {
.c-productsHead__attention__txt a:hover {
text-decoration: none;
}
}
.c-productsHead__fig {
text-align: center;
margin: 0 0 0 24px;
-webkit-box-flex: 0;
-ms-flex: 0 0 350px;
flex: 0 0 350px;
}
@media screen and (max-width: 768px) {
.c-productsHead__fig {
margin: 0 auto;
}
}
@media screen and (max-width: 768px) {
.c-productsHead__fig:not(:first-child) {
margin: 20px 0 0;
}
}
.c-productsHead__linkOther {
text-align: right;
margin: 15px 0 0;
}
@media screen and (max-width: 768px) {
.c-productsHead__linkOther {
text-align: center;
}
}
.c-productsHead__linkOther__button {
font-size: 16px;
font-weight: 700;
color: #555;
line-height: 1.2;
letter-spacing: 0.12em;
text-align: left;
background: #fff;
border: 1px solid #555;
padding: 11px 40px;
display: inline-block;
position: relative;
-webkit-transition: color 0.4s ease, background 0.4s ease, border-color 0.4s ease;
transition: color 0.4s ease, background 0.4s ease, border-color 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsHead__linkOther__button {
font-size: 14px;
}
}
.c-productsHead__linkOther__button::after {
content: "\e90c";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 12px;
position: absolute;
top: 50%;
right: 15px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (min-width: 769px) {
.c-productsHead__linkOther__button:hover {
color: #fff;
background: #d80c24;
border-color: #d80c24;
}
}
@media screen and (max-width: 768px) {
.c-productsHead02 {
max-width: 500px;
margin: 0 auto;
}
}
.c-productsHead02:not(:first-child) {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-productsHead02:not(:first-child) {
margin-top: 20px;
}
}
.c-productsHead02__ttl {
border-bottom: 1px solid #555;
margin: 0 0 20px;
padding: 0 0 20px;
}
@media screen and (max-width: 768px) {
.c-productsHead02__ttl {
margin: 0 0 14px;
padding: 0 0 10px;
}
}
.c-productsHead02__ttl__sub {
font-size: 18px;
font-weight: 500;
line-height: 1.2;
letter-spacing: 0.1em;
vertical-align: middle;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsHead02__ttl__sub {
font-size: 12px;
letter-spacing: 0.05em;
margin: 0 0 2px;
}
}
.c-productsHead02__ttl__main {
font-size: 31px;
font-weight: 700;
line-height: 1.2;
letter-spacing: 0.13em;
vertical-align: middle;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsHead02__ttl__main {
font-size: 18px;
}
}
.c-productsHead02__cont:only-child {
margin-top: -20px;
}
@media screen and (max-width: 768px) {
.c-productsHead02__cont:only-child {
margin-top: -10px;
}
}
.c-productsHead02__link {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.c-productsHead02__link {
display: block;
}
}
.c-productsHead02__link__item {
background: #f4f5f6;
position: relative;
-webkit-transition: background 0.4s ease;
transition: background 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsHead02__link__item:not(:first-child) {
margin-top: 10px;
}
}
.c-productsHead02__link__item--col--2 {
-webkit-box-flex: 0;
-ms-flex: 0 0 49%;
flex: 0 0 49%;
}
@media screen and (min-width: 769px) {
.c-productsHead02__link__item--col--2:nth-child(even) {
margin-left: 2%;
}
.c-productsHead02__link__item--col--2:nth-child(n+3) {
margin-top: 2%;
}
}
.c-productsHead02__link__item--col--3 {
-webkit-box-flex: 0;
-ms-flex: 0 0 31%;
flex: 0 0 31%;
}
@media screen and (min-width: 769px) {
.c-productsHead02__link__item--col--3:not(:nth-child(3n+1)) {
margin-left: 3.5%;
}
.c-productsHead02__link__item--col--3:nth-child(n+4) {
margin-top: 2%;
}
}
@media screen and (min-width: 769px) {
.c-productsHead02__link__item:hover {
background: #d80c24;
}
.c-productsHead02__link__item:hover .c-productsHead02__link__button {
color: #fff;
}
}
.c-productsHead02__link__item::after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 15px 15px;
border-color: transparent transparent #fff transparent;
position: absolute;
right: 0;
bottom: 0;
}
@media screen and (max-width: 768px) {
.c-productsHead02__link__item::after {
border-width: 0 0 12px 12px;
}
}
.c-productsHead02__link__button {
color: #d80c24;
line-height: 1.2;
letter-spacing: 0.12em;
text-align: center;
height: 100%;
padding: 20px 30px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
position: relative;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsHead02__link__button {
letter-spacing: 0.06em;
padding: 15px 30px;
}
}
.c-productsHead02__link__button::after {
content: "\e904";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 10px;
position: absolute;
right: 10px;
top: 50%;
-webkit-transform: translateY(-50%) scale(0.7);
transform: translateY(-50%) scale(0.7);
}
.c-productsHead02__link__txt__sub {
font-size: 12px;
font-weight: 500;
}
@media screen and (max-width: 768px) {
.c-productsHead02__link__txt__sub {
font-size: 10px;
}
}
.c-productsHead02__link__txt__main {
font-size: 16px;
font-weight: 700;
}
@media screen and (max-width: 768px) {
.c-productsHead02__link__txt__main {
font-size: 14px;
}
}
@media screen and (max-width: 768px) {
.c-productsLead {
max-width: 500px;
margin: 0 auto;
}
}
.c-productsLead:not(:first-child) {
margin-top: 50px;
}
@media screen and (max-width: 768px) {
.c-productsLead:not(:first-child) {
margin-top: 32px;
}
}
.c-productsLead__txt {
font-size: 18px;
line-height: 1.78;
letter-spacing: 0.12em;
}
@media screen and (max-width: 768px) {
.c-productsLead__txt {
font-size: 14px;
line-height: 1.5;
}
}
@media screen and (max-width: 768px) {
.c-productsCont__blk {
max-width: 500px;
margin: 0 auto;
}
}
.c-productsCont__blk:not(:first-child) {
margin-top: 130px;
}
@media screen and (max-width: 768px) {
.c-productsCont__blk:not(:first-child) {
margin-top: 56px;
}
}
.c-productsHeading01 {
border-top: 1px solid #d4d4d4;
border-bottom: 1px solid #d4d4d4;
padding: 12px 40px 12px 0;
position: relative;
}
@media screen and (max-width: 768px) {
.c-productsHeading01 {
padding: 15px 30px 15px 0;
}
}
.c-productsHeading01::before {
content: "";
background: #eb1c24;
width: 30px;
height: 1px;
position: absolute;
bottom: -1px;
left: 0;
}
@media screen and (max-width: 768px) {
.c-productsHeading01::before {
width: 15px;
}
}
.c-productsHeading01.__accordion {
cursor: pointer;
}
.c-productsHeading01.__accordion::after {
content: "\e905";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 25px;
color: #d9d9d9;
position: absolute;
top: 50%;
right: 5px;
-webkit-transform: translateY(-50%) rotate(180deg);
transform: translateY(-50%) rotate(180deg);
-webkit-transition: color 0.4s ease, -webkit-transform 0.4s ease;
transition: color 0.4s ease, -webkit-transform 0.4s ease;
transition: color 0.4s ease, transform 0.4s ease;
transition: color 0.4s ease, transform 0.4s ease, -webkit-transform 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsHeading01.__accordion::after {
font-size: 20px;
}
}
.c-productsHeading01.__accordion.is-active::after {
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (min-width: 769px) {
.c-productsHeading01.__accordion:hover::after {
color: #eb1c24;
}
}
.c-productsHeading01.__accordion + .c-productsCont {
display: none;
}
.c-productsHeading01.__accordion + .c-productsCont.is-active {
display: block;
}
.c-productsHeading01:not(:first-child) {
margin-top: 120px;
}
@media screen and (max-width: 768px) {
.c-productsHeading01:not(:first-child) {
margin-top: 60px;
}
}
.c-productsHeading01__sub {
font-size: 18px;
font-weight: 500;
line-height: 1.2;
letter-spacing: 0.4em;
margin: 0 0 5px;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsHeading01__sub {
font-size: 16px;
letter-spacing: 0.1em;
}
}
.c-productsHeading01__main {
font-size: 22px;
font-weight: 500;
line-height: 1.2;
letter-spacing: 0.1em;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsHeading01__main {
font-size: 20px;
letter-spacing: 0.1em;
}
}
.c-productsHeading01__main:first-letter {
color: #d80c24;
}
.c-productsHeading02 {
background: #f4f5f6;
border-bottom: 1px solid #555;
padding: 12px 40px 12px 12px;
position: relative;
}
@media screen and (max-width: 768px) {
.c-productsHeading02 {
max-width: 500px;
margin: 0 auto;
padding: 10px;
}
}
.c-productsHeading02:not(:first-child) {
margin-top: 80px;
}
@media screen and (max-width: 768px) {
.c-productsHeading02:not(:first-child) {
margin-top: 32px;
}
}
.c-productsHeading02__main {
font-size: 20px;
font-weight: 500;
line-height: 1.2;
letter-spacing: 0.2em;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsHeading02__main {
font-size: 18px;
letter-spacing: 0.1em;
}
}
.c-productsHeading03 {
background: #f4f5f6;
border-bottom: 1px solid #555;
padding: 12px 40px 12px 12px;
}
@media screen and (max-width: 768px) {
.c-productsHeading03 {
padding: 10px;
}
}
.c-productsHeading03:not(:first-child) {
margin-top: 60px;
}
@media screen and (max-width: 768px) {
.c-productsHeading03:not(:first-child) {
margin-top: 40px;
}
}
.c-productsHeading03 + .c-productsSeries, .c-productsHeading03 + .c-productsLinkImage03 {
margin-top: 24px !important;
}
.c-productsHeading03.__mt-110 {
margin-top: 110px;
}
@media screen and (max-width: 768px) {
.c-productsHeading03.__mt-110 {
margin-top: 55px;
}
}
.c-productsHeading03__main {
font-size: 20px;
font-weight: 500;
line-height: 1.2;
letter-spacing: 0.2em;
}
@media screen and (max-width: 768px) {
.c-productsHeading03__main {
font-size: 18px;
letter-spacing: 0.1em;
}
}
.c-productsHeading03__main span {
font-size: 16px;
}
@media screen and (max-width: 768px) {
.c-productsHeading03__main span {
font-size: 14px;
}
}
.c-productsHeading04 {
background: #f4f5f6;
padding: 30px 70px 30px 30px;
position: relative;
}
@media screen and (max-width: 768px) {
.c-productsHeading04 {
max-width: 500px;
margin: 0 auto;
padding: 20px 40px 20px 20px;
}
}
.c-productsHeading04:not(:first-child) {
margin-top: 140px;
}
@media screen and (max-width: 768px) {
.c-productsHeading04:not(:first-child) {
margin-top: 56px;
}
}
.c-productsHeading04.__accordion {
cursor: pointer;
}
.c-productsHeading04.__accordion::after {
content: "\e905";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 25px;
color: #d80c24;
position: absolute;
top: 50%;
right: 30px;
-webkit-transform: translateY(-50%) rotate(180deg);
transform: translateY(-50%) rotate(180deg);
-webkit-transition: color 0.4s ease, -webkit-transform 0.4s ease;
transition: color 0.4s ease, -webkit-transform 0.4s ease;
transition: color 0.4s ease, transform 0.4s ease;
transition: color 0.4s ease, transform 0.4s ease, -webkit-transform 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsHeading04.__accordion::after {
font-size: 20px;
right: 15px;
}
}
.c-productsHeading04.__accordion.is-active::after {
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (min-width: 769px) {
.c-productsHeading04.__accordion:hover::after {
color: rgb(245, 141.5, 145.5);
}
}
.c-productsHeading04.__accordion + .c-productsCont {
display: none;
}
.c-productsHeading04.__accordion + .c-productsCont.is-active {
display: block;
}
.c-productsHeading04__ttl {
border-left: 3px solid #d80c24;
padding-left: 1em;
}
.c-productsHeading04__ttl__sub {
font-size: 18px;
font-weight: 500;
line-height: 1.2;
letter-spacing: 0.1em;
vertical-align: middle;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsHeading04__ttl__sub {
font-size: 12px;
letter-spacing: 0.05em;
}
}
.c-productsHeading04__ttl__sub:not(:first-child) {
margin-top: 5px;
}
@media screen and (max-width: 768px) {
.c-productsHeading04__ttl__sub:not(:first-child) {
margin-top: 2px;
}
}
.c-productsHeading04__ttl__main {
font-size: 32px;
font-weight: 700;
line-height: 1.2;
letter-spacing: 0.05em;
vertical-align: middle;
display: inline-block;
}
@media screen and (max-width: 768px) {
.c-productsHeading04__ttl__main {
font-size: 18px;
}
}
.c-productsHeading04__ttl__main:not(:first-child) {
margin-top: 5px;
}
@media screen and (max-width: 768px) {
.c-productsHeading04__ttl__main:not(:first-child) {
margin-top: 2px;
}
}
.c-productsCont {
width: 100%;
max-width: 930px;
margin: 40px auto 0;
}
@media screen and (max-width: 768px) {
.c-productsCont {
margin-top: 24px;
}
}
.c-productsItem {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
@media screen and (max-width: 768px) {
.c-productsItem {
display: block;
}
}
.c-productsItem:not(:first-child) {
margin: 40px 0 0;
}
@media screen and (max-width: 768px) {
.c-productsItem:not(:first-child) {
margin: 20px 0 0;
}
}
.c-productsItem__fig {
max-width: 294px;
margin: 0 0 0 24px;
}
@media screen and (max-width: 768px) {
.c-productsItem__fig {
max-width: 180px;
margin: 0 auto 10px;
}
}
.c-productsItem__ttl {
text-align: center;
}
@media screen and (max-width: 768px) {
.c-productsItem__ttl {
text-align: left;
}
}
.c-productsItem__ttl__img {
max-width: 375px;
}
@media screen and (max-width: 768px) {
.c-productsItem__ttl__img {
max-width: 200px;
margin: 10px 0 0;
}
}
.c-productsItem__detail {
background: rgb(239.7, 241.65, 245.55);
max-width: 440px;
padding: 24px 28px;
display: inline-block;
}
.c-productsItem__detail:not(:first-child) {
margin: 20px 0 0;
}
.c-productsItem__detail__dl {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
@media screen and (max-width: 768px) {
.c-productsItem__detail__dl {
display: block;
}
}
.c-productsItem__detail__dt {
font-size: 14px;
font-weight: 500;
line-height: 2;
-moz-text-align-last: justify;
text-align-last: justify;
text-justify: inter-ideograph;
min-width: 64px;
}
@media screen and (max-width: 768px) {
.c-productsItem__detail__dt {
font-size: 12px;
line-height: 1.5;
-moz-text-align-last: left;
text-align-last: left;
min-width: auto;
}
}
.c-productsItem__detail__dd {
font-size: 14px;
line-height: 2;
margin: 0 0 0 20px;
}
@media screen and (max-width: 768px) {
.c-productsItem__detail__dd {
font-size: 12px;
line-height: 1.5;
margin: 0;
}
}
.c-productsItem__detail__attention:not(:first-child) {
margin-top: 20px;
}
@media screen and (max-width: 768px) {
.c-productsItem__detail__attention:not(:first-child) {
margin-top: 10px;
}
}
.c-productsItem__detail__attention__txt {
font-size: 14px;
color: #eb1c24;
line-height: 1.2;
letter-spacing: 0.12em;
text-decoration: underline;
padding: 0 0 0 20px;
position: relative;
}
@media screen and (max-width: 768px) {
.c-productsItem__detail__attention__txt {
font-size: 12px;
letter-spacing: 0.06em;
padding: 0 0 0 16px;
}
}
.c-productsItem__detail__attention__txt::before {
content: "";
background: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/img/common/icon-attention.png) no-repeat center center/contain;
width: 16px;
height: 14px;
position: absolute;
top: 1px;
left: 0;
}
@media screen and (max-width: 768px) {
.c-productsItem__detail__attention__txt::before {
width: 13px;
height: 13px;
top: 2px;
}
}
.c-pdoructsTxt {
line-height: 1.78;
}
@media screen and (max-width: 768px) {
.c-pdoructsTxt {
line-height: 1.5;
}
}
.c-pdoructsTxt:not(:first-child) {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-pdoructsTxt:not(:first-child) {
margin-top: 20px;
}
}
.c-pdoructsTxt + .c-pdoructsTxt {
margin-top: 20px;
}
.c-pdoructsTxt + .c-productsLinkImage01 {
margin-top: 20px !important;
}
.c-pdoructsTxt a {
color: #d80c24;
text-decoration: underline;
display: inline-block;
}
@media screen and (min-width: 769px) {
.c-pdoructsTxt a:hover {
text-decoration: none;
}
}
.c-pdoructsTxt--s {
font-size: 14px;
}
.c-pdoructsTxt--m {
font-size: 16px;
}
.c-pdoructsTxt--l {
font-size: 18px;
}
.c-productsBg {
background: #f4f5f6;
padding: 30px;
}
@media screen and (max-width: 768px) {
.c-productsBg {
padding: 20px;
}
}
.c-productsBg:not(:first-child) {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-productsBg:not(:first-child) {
margin-top: 20px;
}
}
.c-productsBg__row {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
}
@media screen and (max-width: 768px) {
.c-productsBg__row {
display: block;
}
}
.c-productsBg__row__col {
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
.c-productsBg__row__fig {
text-align: center;
margin: 0 0 0 40px;
-webkit-box-flex: 0;
-ms-flex: 0 0 200px;
flex: 0 0 200px;
}
@media screen and (max-width: 768px) {
.c-productsBg__row__fig {
margin: 0 0 20px;
}
}
.c-productsCard--col--2 {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
@media screen and (max-width: 768px) {
.c-productsCard--col--2 {
display: block;
}
}
.c-productsCard:not(:first-child) {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-productsCard:not(:first-child) {
margin-top: 20px;
}
}
.c-productsCard__item {
background: #f6f2ef;
border-left: 2px solid #d80c24;
padding: 32px;
page-break-inside: avoid;
-webkit-column-break-inside: avoid;
-moz-column-break-inside: avoid;
break-inside: avoid;
}
@media screen and (max-width: 768px) {
.c-productsCard__item {
padding: 20px;
}
}
.c-productsCard__item--col:not(:first-child) {
margin-top: 20px;
}
@media screen and (max-width: 768px) {
.c-productsCard__item--col:not(:first-child) {
margin-top: 10px;
}
}
.c-productsCard__item--col--2 {
-webkit-box-flex: 0;
-ms-flex: 0 0 48%;
flex: 0 0 48%;
}
@media screen and (min-width: 769px) {
.c-productsCard__item--col--2:nth-child(n+3) {
margin-top: 4%;
}
}
@media screen and (max-width: 768px) {
.c-productsCard__item--col--2:not(:first-child) {
margin-top: 20px;
}
}
.c-productsCard__item.__full {
-webkit-box-flex: 0;
-ms-flex: 0 0 100%;
flex: 0 0 100%;
}
.c-productsCard__item.__full .c-productsCard__inner {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
@media screen and (max-width: 768px) {
.c-productsCard__item.__full .c-productsCard__inner {
display: block;
}
}
.c-productsCard__item.__full .c-productsCard__fig {
margin: 0 0 0 20px;
-webkit-box-flex: 0;
-ms-flex: 0 0 40%;
flex: 0 0 40%;
}
@media screen and (max-width: 768px) {
.c-productsCard__item.__full .c-productsCard__fig {
margin: 10px 0 0;
}
}
.c-productsCard__item.__full + .c-productsCard__item {
margin-top: 4%;
}
@media screen and (max-width: 768px) {
.c-productsCard__inner {
display: block;
}
}
.c-productsCard__detail {
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
.c-productsCard__ttl {
font-size: 20px;
font-weight: 700;
color: #d80c24;
line-height: 1.3;
letter-spacing: 0.07em;
}
@media screen and (max-width: 768px) {
.c-productsCard__ttl {
font-size: 18px;
}
}
.c-productsCard__ttl:not(:first-child) {
margin: 10px 0 0;
}
@media screen and (max-width: 768px) {
.c-productsCard__ttl:not(:first-child) {
margin: 6px 0 0;
}
}
.c-productsCard__txt {
font-size: 16px;
line-height: 1.69;
letter-spacing: 0.12em;
}
@media screen and (max-width: 768px) {
.c-productsCard__txt {
font-size: 14px;
}
}
.c-productsCard__txt:not(:first-child) {
margin: 10px 0 0;
}
@media screen and (max-width: 768px) {
.c-productsCard__txt:not(:first-child) {
margin: 6px 0 0;
}
}
.c-productsCard__list:not(:first-child) {
margin-top: 20px;
}
@media screen and (max-width: 768px) {
.c-productsCard__list:not(:first-child) {
margin-top: 10px;
}
}
.c-productsCard__list__item:not(:first-child) {
margin-top: 10px;
}
.c-productsCard__list__txt {
font-size: 16px;
line-height: 1.69;
letter-spacing: 0.12em;
padding: 0 0 0 1.2em;
position: relative;
}
@media screen and (max-width: 768px) {
.c-productsCard__list__txt {
font-size: 14px;
}
}
.c-productsCard__list__txt::before {
content: "●";
color: #d80c24;
position: absolute;
top: 0;
left: 0;
}
.c-productsCard__list__txt:not(:first-child) {
margin: 10px 0 0;
}
@media screen and (max-width: 768px) {
.c-productsCard__list__txt:not(:first-child) {
margin: 6px 0 0;
}
}
.c-productsCard__fig:not(:first-child) {
margin: 20px 0 0;
}
@media screen and (max-width: 768px) {
.c-productsCard__fig:not(:first-child) {
margin: 10px 0 0;
}
}
.c-productsCard__fig__caption {
font-size: 12px;
line-height: 1.6;
margin: 10px 0 0;
}
.c-productsList--split {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.c-productsList--split {
display: block;
}
}
.c-productsList:not(:first-child) {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-productsList:not(:first-child) {
margin-top: 20px;
}
}
.c-productsList + .c-productsList {
margin-top: 10px;
}
@media screen and (max-width: 768px) {
.c-productsList + .c-productsList {
margin-top: 8px;
}
}
.c-productsList + .c-productsList .c-productsList__txt--dotted {
margin-left: 1em;
}
.c-productsList__item--col:not(:first-child) {
margin-top: 2%;
}
.c-productsList__item--col--2 {
-webkit-box-flex: 0;
-ms-flex: 0 0 48%;
flex: 0 0 48%;
}
@media screen and (min-width: 769px) {
.c-productsList__item--col--2:nth-child(even) {
margin-left: 4%;
}
.c-productsList__item--col--2:nth-child(n+3) {
margin-top: 4%;
}
}
@media screen and (max-width: 768px) {
.c-productsList__item--col--2:not(:first-child) {
margin-top: 20px;
}
}
.c-productsList__head__txt {
font-size: 18px;
line-height: 1.67;
letter-spacing: 0.12em;
}
@media screen and (max-width: 768px) {
.c-productsList__head__txt {
font-size: 14px;
}
}
.c-productsList__head__txt--square {
padding: 0 0 0 1.2em;
position: relative;
display: inline-block;
}
.c-productsList__head__txt--square::before {
content: "■";
color: #d80c24;
position: absolute;
left: 0;
top: 0;
}
.c-productsList__detail {
margin: 12px 0 0;
}
@media screen and (max-width: 768px) {
.c-productsList__detail {
margin: 5px 0 0;
}
}
.c-productsList__txt {
font-size: 16px;
line-height: 1.69;
letter-spacing: 0.12em;
}
@media screen and (max-width: 768px) {
.c-productsList__txt {
font-size: 14px;
line-height: 1.5;
}
}
.c-productsList__txt--dotted {
padding: 0 0 0 1.2em;
position: relative;
}
.c-productsList__txt--dotted::before {
content: "・";
position: absolute;
top: 0;
left: 0;
}
.c-productsListNum .c-productsList {
margin-top: 0;
}
@media screen and (max-width: 768px) {
.c-productsListNum .c-productsList {
margin-top: 8px;
}
}
.c-productsListNum .c-productsList .c-productsList__txt--dotted {
margin-left: 1em;
}
.c-productsListNum--split {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.c-productsListNum--split {
display: block;
}
}
.c-productsListNum:not(:first-child) {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-productsListNum:not(:first-child) {
margin-top: 20px;
}
}
.c-productsListNum__item {
counter-reset: unset;
counter-increment: num;
}
.c-productsListNum__head__txt {
font-size: 18px;
line-height: 1.2;
letter-spacing: 0.12em;
}
@media screen and (max-width: 768px) {
.c-productsListNum__head__txt {
font-size: 14px;
}
}
.c-productsListNum__head__txt--square {
padding: 0 0 0 1.2em;
position: relative;
display: inline-block;
}
.c-productsListNum__head__txt--square::before {
content: "■";
position: absolute;
left: 0;
top: 0;
}
.c-productsListNum__detail {
margin: 12px 0 0;
}
@media screen and (max-width: 768px) {
.c-productsListNum__detail {
margin: 5px 0 0;
}
}
.c-productsListNum__txt {
font-size: 16px;
line-height: 1.69;
letter-spacing: 0.12em;
padding: 0 0 0 2em;
position: relative;
}
@media screen and (max-width: 768px) {
.c-productsListNum__txt {
font-size: 14px;
line-height: 1.5;
}
}
.c-productsListNum__txt::before {
content: counter(num) ".";
position: absolute;
top: 0;
left: 0;
}
.c-productsListNum__txt a {
color: #d80c24;
text-decoration: underline;
}
@media screen and (min-width: 769px) {
.c-productsListNum__txt a:hover {
text-decoration: none;
}
}
.c-productsNote:not(:first-child) {
margin-top: 10px;
}
.c-productsNote__item:not(:first-child) {
margin-top: 5px;
}
.c-productsNote__txt {
font-size: 14px;
line-height: 1.2;
padding: 0 0 0 1em;
position: relative;
}
.c-productsNote__txt::before {
content: "※";
position: absolute;
top: 0;
left: 0;
}
.c-productsEmtxt {
border: 1px solid #d80c24;
padding: 20px;
}
.c-productsEmtxt.__center {
text-align: center;
}
.c-productsEmtxt:not(:first-child) {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-productsEmtxt:not(:first-child) {
margin-top: 20px;
}
}
.c-productsEmtxt__item {
font-size: 18px;
font-weight: 700;
color: #d80c24;
line-height: 1.2;
letter-spacing: 0.1em;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsEmtxt__item {
font-size: 14px;
}
}
.c-productsImage {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.c-productsImage:not(:first-child) {
margin-top: 40px;
}
.c-productsImage.__center {
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
@media screen and (min-width: 769px) {
.c-productsImage.__right {
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
}
}
.c-productsImage__fig:not(:first-child) {
margin: 0 0 0 3%;
}
.c-productsImage__fig.__ss {
width: 20%;
}
.c-productsImage__fig.__s {
width: 40%;
}
.c-productsImage__fig.__m {
width: 60%;
}
.c-productsImage__fig.__l {
width: 80%;
}
.c-productsImage__fig.__full {
width: 100%;
}
.c-productsImage__fig__img {
margin: auto;
display: block;
}
.c-productsImage__caption {
font-size: 14px;
line-height: 1.3;
margin-top: 10px;
}
.c-productsRow--1 {
margin: 40px 0 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
@media screen and (max-width: 768px) {
.c-productsRow--1 {
margin: 20px 0 0;
display: block;
}
}
.c-productsRow--1__detail {
background: #f3f5f8;
max-width: 345px;
margin: 0 37px 0 0;
padding: 24px;
}
@media screen and (max-width: 768px) {
.c-productsRow--1__detail {
width: 100%;
max-width: none;
}
}
.c-productsRow--1__head {
font-size: 18px;
font-weight: 500;
line-height: 1.2;
letter-spacing: 0.12em;
text-align: center;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsRow--1__head {
font-size: 16px;
}
}
.c-productsRow--1__txt {
font-size: 16px;
line-height: 1.75;
margin: 14px 0 0;
}
@media screen and (max-width: 768px) {
.c-productsRow--1__txt {
font-size: 13px;
margin: 8px 0 0;
}
}
.c-productsRow--1__table__wrapper {
display: inline-block;
}
@media screen and (max-width: 768px) {
.c-productsRow--1__table__wrapper {
width: 100%;
margin: 20px 0 0;
display: block;
}
}
@media screen and (max-width: 768px) {
.c-productsRow--1__table__inner {
width: 100%;
max-width: max(100%, 400px);
overflow-x: scroll;
}
}
.c-productsRow--1__table__inner table {
width: auto;
min-width: 345px;
border-collapse: collapse;
}
@media screen and (max-width: 768px) {
.c-productsRow--1__table__inner table {
width: 100%;
white-space: nowrap;
}
}
.c-productsRow--1__table__inner table tr {
border-bottom: 1px solid #ccc;
}
.c-productsRow--1__table__inner table tr:first-child {
border-top: 1px solid #ccc;
}
.c-productsRow--1__table__inner table th {
color: #fff;
vertical-align: middle;
background: #99a6c0;
padding: 20px;
}
.c-productsRow--1__table__inner table th:not(:first-child) {
border-left: 1px solid #ccc;
}
.c-productsRow--1__table__inner table td {
vertical-align: middle;
padding: 15px 10px;
}
.c-productsRow--1__table__inner table td:not(:first-child) {
border-left: 1px solid #ccc;
}
.c-productsRow--1__table__head {
font-size: 18px;
line-height: 1.2;
letter-spacing: 0.12em;
margin: 0 0 8px;
}
.c-productsRow--1__list {
margin-top: 10px;
}
.c-productsRow--1__list .c-productsList {
margin-top: 0;
}
.c-productsRow--1__list--split {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.c-productsRow--1__list__item {
margin-top: 8px;
}
@media screen and (max-width: 768px) {
.c-productsRow--1__list__item {
margin-top: 4px;
}
}
.c-productsRow--1__list__txt {
font-size: 16px;
line-height: 1.69;
letter-spacing: 0.12em;
padding: 0 0 0 1.2em;
position: relative;
}
@media screen and (max-width: 768px) {
.c-productsRow--1__list__txt {
font-size: 13px;
line-height: 1.5;
}
}
.c-productsRow--1__list__txt::before {
content: "・";
position: absolute;
top: 0;
left: 0;
}
.c-productsRow--2 {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
@media screen and (max-width: 768px) {
.c-productsRow--2 {
display: block;
}
}
.c-productsRow--2:not(:first-child) {
margin: 40px 0 0;
}
@media screen and (max-width: 768px) {
.c-productsRow--2:not(:first-child) {
margin: 20px 0 0;
}
}
.c-productsRow--2__fig {
max-width: 334px;
margin: 0 37px 0 0;
}
@media screen and (max-width: 768px) {
.c-productsRow--2__fig {
width: 100%;
max-width: none;
}
}
.c-productsRow--2__table__wrapper {
display: inline-block;
}
@media screen and (max-width: 768px) {
.c-productsRow--2__table__wrapper {
width: 100%;
margin: 20px 0 0;
display: block;
}
}
@media screen and (max-width: 768px) {
.c-productsRow--2__table__inner {
width: 100%;
max-width: max(100%, 400px);
overflow-x: scroll;
}
}
.c-productsRow--2__table__inner table {
width: auto;
min-width: 345px;
border-collapse: collapse;
}
@media screen and (max-width: 768px) {
.c-productsRow--2__table__inner table {
width: 100%;
white-space: nowrap;
}
}
.c-productsRow--2__table__inner table tr {
border-bottom: 1px solid #ccc;
}
.c-productsRow--2__table__inner table tr:first-child {
border-top: 1px solid #ccc;
}
.c-productsRow--2__table__inner table th {
color: #fff;
vertical-align: middle;
background: #99a6c0;
padding: 20px;
}
.c-productsRow--2__table__inner table th:not(:first-child) {
border-left: 1px solid #ccc;
}
.c-productsRow--2__table__inner table td {
vertical-align: middle;
padding: 15px 10px;
}
.c-productsRow--2__table__inner table td:first-child {
background: rgb(239.7, 241.65, 245.55);
}
.c-productsRow--2__table__inner table td:not(:first-child) {
border-left: 1px solid #ccc;
}
.c-productsRow--2__table__head {
font-size: 18px;
line-height: 1.2;
letter-spacing: 0.12em;
margin: 0 0 8px;
}
.c-productsRow--2__list {
margin-top: 10px;
}
.c-productsRow--2__list .c-productsList {
margin-top: 0;
}
.c-productsRow--2__list--split {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.c-productsRow--2__list__item {
margin-top: 8px;
}
@media screen and (max-width: 768px) {
.c-productsRow--2__list__item {
margin-top: 4px;
}
}
.c-productsRow--2__list__txt {
font-size: 16px;
line-height: 1.69;
letter-spacing: 0.12em;
padding: 0 0 0 1.2em;
position: relative;
}
@media screen and (max-width: 768px) {
.c-productsRow--2__list__txt {
font-size: 13px;
line-height: 1.5;
}
}
.c-productsRow--2__list__txt::before {
content: "・";
position: absolute;
top: 0;
left: 0;
}
.c-productsRow--3 {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
@media screen and (max-width: 768px) {
.c-productsRow--3 {
display: block;
}
}
.c-productsRow--3:not(:first-child) {
margin-top: 40px;
}
.c-productsRow--3__fig {
-webkit-box-flex: 0;
-ms-flex: 0 0 220px;
flex: 0 0 220px;
margin: 0 32px 0 0;
}
@media screen and (max-width: 768px) {
.c-productsRow--3__fig {
margin: 0 0 20px;
}
}
.c-productsRow--3__fig__img {
margin: auto;
display: block;
}
.c-productsRow--3__detail {
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
.c-productsRow--3__detail__list__item .c-productsRow--3__detail__txt {
padding: 0 0 0 1em;
position: relative;
}
.c-productsRow--3__detail__list__item .c-productsRow--3__detail__txt::before {
content: "・";
position: absolute;
top: 0;
left: 0;
}
.c-productsRow--3__detail__txt {
font-size: 16px;
line-height: 1.69;
}
@media screen and (max-width: 768px) {
.c-productsRow--3__detail__txt {
font-size: 14px;
line-height: 1.5;
}
}
.c-productsTable__wrapper {
width: 100%;
min-width: 345px;
margin: 0 auto;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsTable__wrapper {
min-width: auto;
}
}
.c-productsTable__wrapper:not(:first-child) {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-productsTable__wrapper:not(:first-child) {
margin-top: 20px;
}
}
.c-productsTable__head {
font-size: 18px;
line-height: 1.2;
letter-spacing: 0.12em;
margin: 0 0 8px;
}
@media screen and (max-width: 768px) {
.c-productsTable__head {
font-size: 16px;
}
}
@media screen and (max-width: 768px) {
.c-productsTable__inner {
width: 100%;
max-width: max(100%, 400px);
overflow-x: scroll;
}
}
.c-productsTable__inner--001 table {
min-width: 345px;
margin: 0 auto;
border-collapse: collapse;
}
@media screen and (max-width: 768px) {
.c-productsTable__inner--001 table {
width: 100%;
white-space: nowrap;
}
}
.c-productsTable__inner--001 table th, .c-productsTable__inner--001 table td {
border: 1px solid #d4d4d4;
}
.c-productsTable__inner--001 table th.__textalign--right, .c-productsTable__inner--001 table td.__textalign--right {
text-align: left;
}
.c-productsTable__inner--001 table th {
font-size: 14px;
color: #fff;
line-height: 1.5;
vertical-align: middle;
background: #8f99a3;
border: 1px solid #d4d4d4;
padding: 20px;
}
@media screen and (max-width: 768px) {
.c-productsTable__inner--001 table th {
font-size: 13px;
padding: 15px;
}
}
.c-productsTable__inner--001 table td {
font-size: 14px;
line-height: 1.5;
text-align: center;
vertical-align: middle;
padding: 15px 10px;
}
@media screen and (max-width: 768px) {
.c-productsTable__inner--001 table td {
font-size: 13px;
}
}
.c-productsTable__inner--001 table .c-text-align-left {
text-align: left;
}
.c-productsTable__inner--001 table a {
color: #d80c24;
text-decoration: underline;
display: inline-block;
}
@media screen and (min-width: 769px) {
.c-productsTable__inner--001 table a:hover {
text-decoration: none;
}
}
.c-productsTable__inner--002 table {
min-width: 345px;
margin: 0 auto;
border-collapse: collapse;
}
@media screen and (max-width: 768px) {
.c-productsTable__inner--002 table {
width: 100%;
white-space: nowrap;
}
}
.c-productsTable__inner--002 table tr:nth-child(odd) td {
background: #ebeff3;
background: rgb(238.2, 239.7, 241.2);
}
.c-productsTable__inner--002 table th, .c-productsTable__inner--002 table td {
border: 1px solid #ccc;
}
.c-productsTable__inner--002 table th.__textalign--right, .c-productsTable__inner--002 table td.__textalign--right {
text-align: left;
}
.c-productsTable__inner--002 table th {
font-size: 14px;
color: #fff;
line-height: 1.5;
vertical-align: middle;
background: #8f99a3;
border: 1px solid #ccc;
padding: 20px;
}
@media screen and (max-width: 768px) {
.c-productsTable__inner--002 table th {
font-size: 13px;
padding: 15px;
}
}
.c-productsTable__inner--002 table td {
font-size: 14px;
line-height: 1.5;
text-align: center;
vertical-align: middle;
padding: 15px 10px;
}
@media screen and (max-width: 768px) {
.c-productsTable__inner--002 table td {
font-size: 13px;
}
}
.c-productsTable__inner--002 table .c-text-align-left {
text-align: left;
}
.c-productsTable__inner--002 table a {
color: #d80c24;
text-decoration: underline;
display: inline-block;
}
@media screen and (min-width: 769px) {
.c-productsTable__inner--002 table a:hover {
text-decoration: none;
}
}
.c-productsTable__inner .__vertical-rl {
-webkit-writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
}
.c-productsSupplement {
text-align: center;
margin: 40px 0 0;
}
@media screen and (max-width: 768px) {
.c-productsSupplement {
margin: 20px 0 0;
}
}
.c-productsSupplement__inner {
background: rgb(239.7, 241.65, 245.55);
padding: 20px;
display: inline-block;
}
@media screen and (max-width: 768px) {
.c-productsSupplement__inner {
padding: 10px;
}
}
.c-productsSupplement__fig {
display: block;
}
.c-productsSupplement__fig:not(:first-child) {
margin-top: 10px;
}
.c-productsSupplement__fig__img {
width: 100%;
max-width: 465px;
}
@media screen and (max-width: 768px) {
.c-productsSupplement__fig__img {
max-width: 100%;
}
}
.c-productsSupplement__txt {
font-size: 16px;
line-height: 1.69;
text-align: left;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsSupplement__txt {
font-size: 13px;
line-height: 1.5;
}
}
.c-productsSupplement__txt:not(:first-child) {
margin-top: 10px;
}
.c-productsReginLink01:not(:first-child) {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-productsReginLink01:not(:first-child) {
margin-top: 20px;
}
}
.c-productsReginLink01 + .c-productsReginHead {
margin-top: 100px !important;
}
@media screen and (max-width: 768px) {
.c-productsReginLink01 + .c-productsReginHead {
margin-top: 50px;
}
}
.c-productsReginLink01__ttl {
border-bottom: 1px solid #8f99a3;
margin: 0 0 1.5em;
padding: 0 0 1em;
}
.c-productsReginLink01__ttl__main {
font-size: 36px;
font-weight: 700;
color: #d80c24;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsReginLink01__ttl__main {
font-size: 20px;
}
}
.c-productsReginLink01__lead {
font-size: 18px;
line-height: 2;
}
@media screen and (max-width: 768px) {
.c-productsReginLink01__lead {
font-size: 16px;
line-height: 1.6;
}
}
.c-productsReginLink01__list {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.c-productsReginLink01__list {
display: block;
}
}
.c-productsReginLink01__list:not(:first-child) {
margin-top: 30px;
}
@media screen and (max-width: 768px) {
.c-productsReginLink01__list:not(:first-child) {
margin-top: 15px;
}
}
.c-productsReginLink01__list__item {
background: #f4f5f6;
border: 1px solid #d80c24;
-webkit-transition: background 0.4s ease;
transition: background 0.4s ease;
-webkit-box-flex: 0;
-ms-flex: 0 0 32%;
flex: 0 0 32%;
position: relative;
}
@media screen and (min-width: 769px) {
.c-productsReginLink01__list__item:not(:nth-child(3n+1)) {
margin-left: 2%;
}
.c-productsReginLink01__list__item:nth-child(n+4) {
margin-top: 2%;
}
}
@media screen and (max-width: 768px) {
.c-productsReginLink01__list__item:not(:first-child) {
margin-top: 10px;
}
}
.c-productsReginLink01__list__item:hover {
background: #d80c24;
}
.c-productsReginLink01__list__item:hover .c-productsReginLink01__list__txt__sub {
color: #fff;
}
.c-productsReginLink01__list__item:hover::after {
color: #fff;
}
.c-productsReginLink01__list__item::after {
content: "\e904";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 10px;
color: #d80c24;
position: absolute;
left: 50%;
bottom: 12px;
-webkit-transform: scale(0.8);
transform: scale(0.8);
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsReginLink01__list__item::after {
-webkit-transform: scale(0.6);
transform: scale(0.6);
bottom: 5px;
}
}
.c-productsReginLink01__list__link {
width: 100%;
height: 100%;
padding: 32px 20px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
position: relative;
}
@media screen and (max-width: 768px) {
.c-productsReginLink01__list__link {
padding: 20px;
}
}
.c-productsReginLink01__list__link::before {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 16px 16px;
border-color: transparent transparent #fff transparent;
position: absolute;
right: -1px;
bottom: -1px;
z-index: 10;
}
.c-productsReginLink01__list__link::after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 15px 15px;
border-color: transparent transparent #d80c24 transparent;
position: absolute;
right: 0;
bottom: 0;
}
.c-productsReginLink01__list__txt {
width: 100%;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.c-productsReginLink01__list__txt__sub {
font-size: 16px;
font-weight: 500;
color: #d80c24;
line-height: 1.2;
text-align: center;
margin: 0 0 10px;
display: inline-block;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsReginLink01__list__txt__sub {
font-size: 13px;
margin: 0 0 5px;
}
}
.c-productsReginLink01__list__txt__main {
font-size: 18px;
font-weight: 700;
color: #fff;
text-align: center;
background: #d80c24;
line-height: 1.2;
padding: 5px;
display: inline-block;
}
@media screen and (max-width: 768px) {
.c-productsReginLink01__list__txt__main {
font-size: 16px;
}
}
.c-productsReginHead {
background: #f4f5f6;
padding: 46px 40px;
}
@media screen and (max-width: 768px) {
.c-productsReginHead {
padding: 24px;
}
}
.c-productsReginHead:not(:first-child) {
margin-top: 200px;
}
@media screen and (max-width: 768px) {
.c-productsReginHead:not(:first-child) {
margin-top: 100px;
}
}
.c-productsReginHead__ttl {
border-bottom: 1px solid #8f99a3;
padding: 0 0 1em;
position: relative;
}
.c-productsReginHead__ttl::after {
content: "";
background: #d80c24;
width: 30px;
height: 1px;
position: absolute;
bottom: -1px;
left: 0;
}
.c-productsReginHead__ttl__inner {
border-left: 3px solid #d80c24;
padding-left: 1em;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsReginHead__ttl__inner {
border-width: 2px;
padding-left: 0.6em;
}
}
.c-productsReginHead__ttl__ja__sub {
font-size: 18px;
font-weight: 700;
margin: 0 10px 0 0;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsReginHead__ttl__ja__sub {
font-size: 12px;
margin: 0 0 5px;
}
}
.c-productsReginHead__ttl__ja__sub:not(:first-child) {
margin-top: 5px;
}
@media screen and (max-width: 768px) {
.c-productsReginHead__ttl__ja__sub:not(:first-child) {
margin-top: 2px;
}
}
.c-productsReginHead__ttl__ja__sub:not(:first-child) {
margin-top: 5px;
}
@media screen and (max-width: 768px) {
.c-productsReginHead__ttl__ja__sub:not(:first-child) {
margin-top: 2px;
}
}
.c-productsReginHead__ttl__ja__main {
font-size: 36px;
font-weight: 700;
display: inline-block;
}
@media screen and (max-width: 768px) {
.c-productsReginHead__ttl__ja__main {
font-size: 24px;
}
}
.c-productsReginHead__ttl__ja__main:not(:first-child) {
margin-top: 5px;
}
@media screen and (max-width: 768px) {
.c-productsReginHead__ttl__ja__main:not(:first-child) {
margin-top: 2px;
}
}
.c-productsReginHead__ttl__en {
display: block;
margin-top: 12px;
}
@media screen and (max-width: 768px) {
.c-productsReginHead__ttl__en {
margin-top: 5px;
}
}
.c-productsReginHead__ttl__en:not(:first-child) {
margin-top: 5px;
}
@media screen and (max-width: 768px) {
.c-productsReginHead__ttl__en:not(:first-child) {
margin-top: 2px;
}
}
.c-productsReginHead__ttl__en__sub {
font-size: 18px;
font-weight: 700;
letter-spacing: 0.1em;
margin-top: 12px;
}
@media screen and (max-width: 768px) {
.c-productsReginHead__ttl__en__sub {
font-size: 12px;
}
}
.c-productsReginHead__cont {
margin: 20px 0 0;
}
.c-productsReginHead__list__item:not(:first-child) {
margin-top: 10px;
}
.c-productsReginHead__list__txt {
font-size: 18px;
line-height: 1.3;
padding-left: 1.2em;
position: relative;
}
@media screen and (max-width: 768px) {
.c-productsReginHead__list__txt {
font-size: 14px;
}
}
.c-productsReginHead__list__txt::before {
content: "■";
color: #d80c24;
position: absolute;
left: 0;
}
.c-productsReginHead__list__txt span {
color: #d80c24;
}
.c-productsReginHead__list__txt a {
font-weight: 500;
text-decoration: underline;
}
@media screen and (min-width: 769px) {
.c-productsReginHead__list__txt a:hover {
text-decoration: none;
}
}
.c-productsReginLink02:not(:first-child) {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-productsReginLink02:not(:first-child) {
margin-top: 20px;
}
}
.c-productsReginLink02__main {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.c-productsReginLink02__main {
display: block;
}
}
.c-productsReginLink02__main__item {
background: #f4f5f6;
border: 2px solid #d80c24;
-webkit-box-flex: 0;
-ms-flex: 0 0 32%;
flex: 0 0 32%;
}
@media screen and (min-width: 769px) {
.c-productsReginLink02__main__item:not(:nth-child(3n+1)) {
margin-left: 2%;
}
.c-productsReginLink02__main__item:nth-child(n+4) {
margin-top: 2%;
}
}
@media screen and (max-width: 768px) {
.c-productsReginLink02__main__item:not(:first-child) {
margin-top: 10px;
}
}
.c-productsReginLink02__main__link {
height: 100%;
display: block;
-webkit-transition: background 0.4s ease;
transition: background 0.4s ease;
}
a.c-productsReginLink02__main__link {
position: relative;
}
a.c-productsReginLink02__main__link .c-productsReginLink02__ttl {
position: relative;
}
a.c-productsReginLink02__main__link .c-productsReginLink02__ttl::after {
content: "\e902";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 15px;
position: absolute;
top: 50%;
right: 10px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: right 0.4s ease;
transition: right 0.4s ease;
}
@media screen and (max-width: 768px) {
a.c-productsReginLink02__main__link .c-productsReginLink02__ttl::after {
font-size: 12px;
}
}
a.c-productsReginLink02__main__link::before {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 16px 16px;
border-color: transparent transparent #fff transparent;
position: absolute;
right: -2px;
bottom: -2px;
z-index: 10;
}
a.c-productsReginLink02__main__link::after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 15px 15px;
border-color: transparent transparent #d80c24 transparent;
position: absolute;
right: 0;
bottom: 0;
}
@media screen and (min-width: 769px) {
a.c-productsReginLink02__main__link:hover {
background: #d80c24;
}
a.c-productsReginLink02__main__link:hover .c-productsReginLink02__main__fig__img {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
a.c-productsReginLink02__main__link:hover .c-productsReginLink02__ttl {
color: #fff;
}
a.c-productsReginLink02__main__link:hover .c-productsReginLink02__ttl::after {
right: 5px;
}
}
.c-productsReginLink02__main__fig {
background: #fff;
width: 100%;
height: 144px;
padding: 20px;
position: relative;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsReginLink02__main__fig {
height: 100px;
padding: 10px;
}
}
.c-productsReginLink02__main__fig__img {
width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
overflow: hidden;
-webkit-transition: -webkit-transform 0.4s ease;
transition: -webkit-transform 0.4s ease;
transition: transform 0.4s ease;
transition: transform 0.4s ease, -webkit-transform 0.4s ease;
}
.c-productsReginLink02__ttl {
color: #d80c24;
line-height: 1.2;
text-align: center;
padding: 20px;
position: relative;
display: block;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsReginLink02__ttl {
padding: 10px 20px;
}
}
.c-productsReginLink02__ttl__main {
font-size: 28px;
font-weight: 700;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsReginLink02__ttl__main {
font-size: 20px;
}
}
.c-productsReginLink02__ttl__sub {
font-family: YakuHanMP, "Rajdhani", "Noto Serif JP", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", serif;
font-size: 14px;
font-weight: 600;
margin: 10px 0 0;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsReginLink02__ttl__sub {
font-size: 12px;
margin: 5px 0 0;
}
}
.c-productsReginLink02__sub {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.c-productsReginLink02__sub {
display: block;
}
}
.c-productsReginLink02__sub:not(:first-child) {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-productsReginLink02__sub:not(:first-child) {
margin-top: 20px;
}
}
.c-productsReginLink02__sub__item {
-webkit-box-flex: 0;
-ms-flex: 0 0 49%;
flex: 0 0 49%;
position: relative;
-webkit-transition: background 0.4s ease;
transition: background 0.4s ease;
}
@media screen and (min-width: 769px) {
.c-productsReginLink02__sub__item:nth-child(even) {
margin-left: 2%;
}
.c-productsReginLink02__sub__item:nth-child(n+3) {
margin-top: 2%;
}
}
@media screen and (max-width: 768px) {
.c-productsReginLink02__sub__item:not(:first-child) {
margin-top: 10px;
}
}
@media screen and (min-width: 769px) {
.c-productsReginLink02__sub__item:only-child {
margin: auto;
}
}
.c-productsReginLink02__sub__item::before {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 16px 16px;
border-color: transparent transparent #fff transparent;
position: absolute;
right: -2px;
bottom: -2px;
z-index: 10;
}
.c-productsReginLink02__sub__item::after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 15px 15px;
border-color: transparent transparent #d80c24 transparent;
position: absolute;
right: 0;
bottom: 0;
}
.c-productsReginLink02__sub__link {
background: #d80c24;
border: 2px solid #d80c24;
height: 100%;
padding: 20px 50px;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-transition: background 0.4s ease;
transition: background 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsReginLink02__sub__link {
padding: 10px 30px;
}
}
.c-productsReginLink02__sub__link::after {
content: "\e902";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 15px;
color: #fff;
position: absolute;
top: 50%;
right: 20px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsReginLink02__sub__link::after {
font-size: 12px;
right: 15px;
}
}
@media screen and (min-width: 769px) {
.c-productsReginLink02__sub__link:hover {
background: #fff;
}
.c-productsReginLink02__sub__link:hover::after {
color: #d80c24;
}
.c-productsReginLink02__sub__link:hover .c-productsReginLink02__sub__txt {
color: #d80c24;
}
}
.c-productsReginLink02__sub__txt {
color: #fff;
line-height: 1.2;
text-align: center;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
.c-productsReginLink02__sub__txt__main {
font-size: 15px;
font-weight: 700;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsReginLink02__sub__txt__main {
font-size: 14px;
}
}
.c-productsReginLink02__sub__txt__main__em {
font-size: 22px;
}
@media screen and (max-width: 768px) {
.c-productsReginLink02__sub__txt__main__em {
font-size: 18px;
}
}
.c-productsReginLink02__sub__txt__en {
font-family: YakuHanMP, "Rajdhani", "Noto Serif JP", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", serif;
font-size: 18px;
font-weight: 600;
letter-spacing: 0.04em;
margin: 5px 0 0;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsReginLink02__sub__txt__en {
font-size: 12px;
}
}
.c-productsSeries {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.c-productsSeries {
margin: 25px 0 0;
display: block;
}
}
.c-productsSeries--blk {
display: block;
}
.c-productsSeries--blk + .c-productsHeading03 {
margin-top: 32px;
}
.c-productsSeries:not(:first-child) {
margin-top: 80px;
}
@media screen and (max-width: 768px) {
.c-productsSeries:not(:first-child) {
margin-top: 40px;
}
}
@media screen and (max-width: 768px) {
.c-productsSeries__item:not(:first-child) {
margin-top: 32px;
}
}
@media screen and (min-width: 769px) {
.c-productsSeries__item--col {
display: -ms-grid;
display: grid;
-ms-grid-columns: auto 1fr;
grid-template-columns: auto 1fr;
-ms-grid-rows: auto auto;
grid-template-rows: auto auto;
grid-template-areas: "ttl ttl" "img cont";
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: start;
-ms-flex-line-pack: start;
align-content: start;
justify-items: start;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: start;
}
.c-productsSeries__item--col .c-productsSeries__ttl {
grid-area: ttl;
}
.c-productsSeries__item--col .c-productsSeries__fig {
grid-area: img;
-ms-grid-row-align: center;
align-self: center;
max-width: 230px;
}
.c-productsSeries__item--col .c-productsSeries__fig:not(:last-child) {
margin-right: 40px;
}
.c-productsSeries__item--col .c-productsSeries__detail {
grid-area: cont;
-ms-grid-row-align: center;
align-self: center;
width: 100%;
}
.c-productsSeries__item--col:not(:first-child) {
margin-top: 40px;
}
}
@media screen and (min-width: 769px){
.c-productsSeries__item--col .c-productsSeries__ttl {
-ms-grid-row: 1;
-ms-grid-column: 1;
-ms-grid-column-span: 2;
}
.c-productsSeries__item--col .c-productsSeries__fig {
-ms-grid-row: 2;
-ms-grid-column: 1;
}
.c-productsSeries__item--col .c-productsSeries__detail {
-ms-grid-row: 2;
-ms-grid-column: 2;
}
}
.c-productsSeries__item--col--2 {
-webkit-box-flex: 0;
-ms-flex: 0 0 46%;
flex: 0 0 46%;
}
@media screen and (min-width: 769px) {
.c-productsSeries__item--col--2:nth-child(even) {
margin-left: 8%;
}
.c-productsSeries__item--col--2:nth-child(n+3) {
margin-top: 8%;
}
}
.c-productsSeries__item--col--3 {
-webkit-box-flex: 0;
-ms-flex: 0 0 30%;
flex: 0 0 30%;
}
@media screen and (min-width: 769px) {
.c-productsSeries__item--col--3:not(:nth-child(3n+1)) {
margin-left: 5%;
}
.c-productsSeries__item--col--3:nth-child(n+4) {
margin-top: 5%;
}
}
.c-productsSeries__ttl {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.c-productsSeries__ttl:not(:first-child) {
margin-top: 16px;
}
.c-productsSeries__ttl__inner {
padding: 0 0 0 1.5em;
position: relative;
}
@media screen and (max-width: 768px) {
.c-productsSeries__ttl__inner {
padding: 0 0 0 1.2em;
}
}
.c-productsSeries__ttl__inner::before {
content: "■";
font-size: 18px;
color: #eb1c24;
position: absolute;
top: 3px;
left: 0;
}
@media screen and (max-width: 768px) {
.c-productsSeries__ttl__inner::before {
font-size: 12px;
top: 4px;
}
}
.c-productsSeries__ttl__main {
font-size: 20px;
font-weight: 700;
line-height: 1.2;
}
@media screen and (max-width: 768px) {
.c-productsSeries__ttl__main {
font-size: 16px;
}
}
.c-productsSeries__ttl__sub {
font-size: 14px;
font-weight: 700;
line-height: 1.2;
}
@media screen and (max-width: 768px) {
.c-productsSeries__ttl__sub {
font-size: 12px;
}
}
.c-productsSeries__fig {
text-align: center;
width: 100%;
height: 240px;
position: relative;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsSeries__fig {
height: 150px;
}
}
.c-productsSeries__fig:not(:first-child) {
margin-top: 10px;
}
.c-productsSeries__fig__img {
width: auto;
max-width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
}
.c-productsSeries__detail {
border-top: 1px solid #d4d4d4;
border-bottom: 1px solid #d4d4d4;
padding: 20px;
}
@media screen and (max-width: 768px) {
.c-productsSeries__detail {
padding: 15px;
}
}
.c-productsSeries__detail:not(:first-child) {
margin-top: 10px;
}
.c-productsSeries__detail__dl {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.c-productsSeries__detail__dl:not(:first-child) {
margin-top: 5px;
}
.c-productsSeries__detail__dt {
font-size: 14px;
line-height: 1.57;
-moz-text-align-last: justify;
text-align-last: justify;
margin: 0 14px 0 0;
-webkit-box-flex: 0;
-ms-flex: 0 0 80px;
flex: 0 0 80px;
}
@media screen and (max-width: 768px) {
.c-productsSeries__detail__dt {
font-size: 12px;
line-height: 1.4;
-webkit-box-flex: 0;
-ms-flex: 0 0 70px;
flex: 0 0 70px;
}
}
.c-productsSeries__detail__dd {
font-size: 14px;
line-height: 1.57;
letter-spacing: 0.08em;
word-break: break-all;
}
@media screen and (max-width: 768px) {
.c-productsSeries__detail__dd {
font-size: 12px;
line-height: 1.4;
margin: 0 0 0 10px;
}
}
.c-productsSeries__detail__dd a {
color: #d80c24;
text-decoration: underline;
display: inline-block;
}
@media screen and (min-width: 769px) {
.c-productsSeries__detail__dd a:hover {
text-decoration: none;
}
}
.test-ttl01 {
font-size: 24px;
font-weight: 500;
line-height: 1.2;
text-align: center;
border-top: 1px solid #555;
border-bottom: 1px solid #555;
padding: 15px;
}
@media screen and (max-width: 768px) {
.test-ttl01 {
font-size: 18px;
}
}
.test-ttl01:not(:first-child) {
margin: 100px 0 0;
}
.c-productsRow {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
@media screen and (max-width: 768px) {
.c-productsRow {
display: block;
}
}
@media screen and (min-width: 769px) {
.c-productsRow--01 .c-productsRow__col {
-webkit-box-flex: 0;
-ms-flex: 0 1 auto;
flex: 0 1 auto;
}
}
.c-productsRow:not(:first-child) {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-productsRow:not(:first-child) {
margin-top: 20px;
}
}
.c-productsRow__col {
-webkit-box-flex: 0;
-ms-flex: 0 0 48%;
flex: 0 0 48%;
}
@media screen and (min-width: 769px) {
.c-productsRow__col:nth-child(even) {
margin-left: 4%;
}
.c-productsRow__col:nth-child(n+3) {
margin-top: 4%;
}
}
@media screen and (max-width: 768px) {
.c-productsRow__col:not(:first-child) {
margin-top: 20px;
}
}
.c-productsLinkImage01--split {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage01--split {
display: block;
}
}
.c-productsLinkImage01:not(:first-child) {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage01:not(:first-child) {
margin-top: 20px;
}
}
.c-productsLinkImage01__item {
background: #f4f5f6;
padding: 10px 20px 30px;
position: relative;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage01__item {
padding: 25px 20px;
}
.c-productsLinkImage01__item:not(:first-child) {
margin-top: 20px;
}
}
.c-productsLinkImage01__item--col--2 {
-webkit-box-flex: 0;
-ms-flex: 0 0 48%;
flex: 0 0 48%;
}
@media screen and (min-width: 769px) {
.c-productsLinkImage01__item--col--2:nth-child(even) {
margin-left: 4%;
}
.c-productsLinkImage01__item--col--2:nth-child(n+3) {
margin-top: 4%;
}
}
.c-productsLinkImage01__item--col--3 {
-webkit-box-flex: 0;
-ms-flex: 0 0 32%;
flex: 0 0 32%;
}
@media screen and (min-width: 769px) {
.c-productsLinkImage01__item--col--3:not(:nth-child(3n+1)) {
margin-left: 2%;
}
.c-productsLinkImage01__item--col--3:nth-child(n+4) {
margin-top: 2%;
}
}
@media screen and (min-width: 769px) {
.c-productsLinkImage01__item--split {
padding: 30px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
}
.c-productsLinkImage01__item--split .c-productsLinkImage01__fig {
margin-left: 20px;
}
}
@media screen and (max-width: 768px) {
.c-productsLinkImage01__item--split {
display: block;
}
}
@media screen and (min-width: 769px) {
.c-productsLinkImage01__item--blk {
text-align: center;
}
.c-productsLinkImage01__item--blk .c-productsLinkImage01__fig {
margin-bottom: 10px;
}
}
.c-productsLinkImage01__sup {
font-size: 13px;
font-weight: 700;
color: #fff;
letter-spacing: 0.2em;
background: #8f99a3;
padding: 8px 10px;
position: absolute;
top: 0;
left: 0;
z-index: 10;
}
@media screen and (min-width: 769px) {
.c-productsLinkImage01__sup + .c-productsLinkImage01__cont {
margin: 40px 0 30px;
}
}
@media screen and (max-width: 768px) {
.c-productsLinkImage01__sup {
font-size: 10px;
padding: 8px;
}
.c-productsLinkImage01__sup + * {
margin-top: 10px;
}
}
.c-productsLinkImage01__fig {
position: relative;
-webkit-box-flex: 0;
-ms-flex: 0 0 160px;
flex: 0 0 160px;
overflow: hidden;
}
.c-productsLinkImage01__fig__inner {
padding-top: 100%;
}
.c-productsLinkImage01__fig__img {
-o-object-fit: contain;
object-fit: contain;
height: 100%;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.c-productsLinkImage01__cont {
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage01__cont:not(:first-child) {
margin-top: 10px;
}
}
@media screen and (max-width: 768px) {
.c-productsLinkImage01__ttl {
text-align: center;
}
}
.c-productsLinkImage01__ttl__main {
font-size: 20px;
font-weight: 700;
color: #d80c24;
line-height: 1.2;
letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage01__ttl__main {
font-size: 18px;
}
}
.c-productsLinkImage01__txt:not(:first-child) {
margin-top: 10px;
}
.c-productsLinkImage01__txt__item {
font-size: 16px;
line-height: 1.3;
}
.c-productsLinkImage01__button {
text-align: center;
background: #d80c24;
padding: 12px 20px;
display: block;
position: relative;
-webkit-transition: background 0.4s ease;
transition: background 0.4s ease;
}
@media screen and (min-width: 769px) {
.c-productsLinkImage01__button:hover {
background: rgb(246.0947368421, 94.7052631579, 112.5157894737);
}
}
.c-productsLinkImage01__button:not(:first-child) {
margin-top: 10px;
}
.c-productsLinkImage01__button::before {
content: "\e902";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 12px;
color: #fff;
position: absolute;
top: 50%;
right: 10px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
.c-productsLinkImage01__button::before {
font-size: 10px;
}
}
.c-productsLinkImage01__button::after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 10px 10px;
border-color: transparent transparent #f4f5f6 transparent;
position: absolute;
right: 0;
bottom: 0;
-webkit-transition: border-width 0.4s ease;
transition: border-width 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage01__button::after {
border-width: 0 0 5px 5px;
}
}
.c-productsLinkImage01__button__txt {
font-size: 14px;
font-weight: 700;
color: #fff;
line-height: 1.2;
letter-spacing: 0.2em;
}
.c-productsLinkImage02--split {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage02--split {
display: block;
}
}
.c-productsLinkImage02:not(:first-child) {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage02:not(:first-child) {
margin-top: 20px;
}
}
.c-productsLinkImage02__item {
background: #f4f5f6;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage02__item:not(:first-child) {
margin-top: 20px;
}
}
.c-productsLinkImage02__item--col--2 {
-webkit-box-flex: 0;
-ms-flex: 0 0 48%;
flex: 0 0 48%;
}
@media screen and (min-width: 769px) {
.c-productsLinkImage02__item--col--2:nth-child(even) {
margin-left: 4%;
}
.c-productsLinkImage02__item--col--2:nth-child(n+3) {
margin-top: 4%;
}
}
.c-productsLinkImage02__link {
padding: 15px 40px 15px 15px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
display: flex;
position: relative;
}
.c-productsLinkImage02__link::after {
content: "\e902";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 18px;
position: absolute;
top: 50%;
right: 20px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: color 0.4s ease, right 0.4s ease;
transition: color 0.4s ease, right 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage02__link::after {
font-size: 14px;
}
}
@media screen and (min-width: 769px) {
.c-productsLinkImage02__link:hover::after {
color: #d80c24;
right: 15px;
}
.c-productsLinkImage02__link:hover .c-productsLinkImage02__ttl__sub, .c-productsLinkImage02__link:hover .c-productsLinkImage02__ttl__main {
color: #d80c24;
}
.c-productsLinkImage02__link:hover .c-productsLinkImage02__fig__img {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
}
.c-productsLinkImage02__fig {
width: 100%;
margin: 0 20px 0 0;
position: relative;
-webkit-box-flex: 0;
-ms-flex: 0 0 180px;
flex: 0 0 180px;
overflow: hidden;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage02__fig {
-webkit-box-flex: 0;
-ms-flex: 0 0 100px;
flex: 0 0 100px;
}
}
.c-productsLinkImage02__fig__inner {
background: #fff;
padding-top: 100%;
}
.c-productsLinkImage02__fig__img {
-o-object-fit: contain;
object-fit: contain;
width: 100%;
height: 100%;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
-webkit-transition: -webkit-transform 0.4s ease;
transition: -webkit-transform 0.4s ease;
transition: transform 0.4s ease;
transition: transform 0.4s ease, -webkit-transform 0.4s ease;
}
.c-productsLinkImage02__cont {
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
.c-productsLinkImage02__cont:only-child {
margin: 20px 10px;
}
.c-productsLinkImage02__ttl__sub {
font-size: 14px;
font-weight: 700;
line-height: 1.2;
margin: 0 0 10px;
display: block;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage02__ttl__sub {
font-size: 10px;
margin: 0 0 3px;
}
}
.c-productsLinkImage02__ttl__main {
font-size: 26px;
font-weight: 700;
line-height: 1.3;
display: block;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage02__ttl__main {
font-size: 18px;
}
}
.c-productsLinkImage03--split {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage03--split {
display: block;
}
}
.c-productsLinkImage03:not(:first-child) {
margin-top: 60px;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage03:not(:first-child) {
margin-top: 40px;
}
}
.c-productsLinkImage03__item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage03__item:not(:first-child) {
margin-top: 20px;
}
}
.c-productsLinkImage03__item--col:not(:first-child) {
margin-top: 20px;
}
.c-productsLinkImage03__item--col--2 {
-webkit-box-flex: 0;
-ms-flex: 0 0 48%;
flex: 0 0 48%;
}
@media screen and (min-width: 769px) {
.c-productsLinkImage03__item--col--2:nth-child(even) {
margin-left: 4%;
}
.c-productsLinkImage03__item--col--2:nth-child(n+3) {
margin-top: 60px;
}
}
.c-productsLinkImage03__lead {
font-size: 16px;
line-height: 1.5;
letter-spacing: 0.05em;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage03__lead {
font-size: 14px;
line-height: 1.4;
}
}
.c-productsLinkImage03__lead:not(:first-child) {
margin-top: 1em;
}
.c-productsLinkImage03__cont {
margin-top: 24px;
margin-top: auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: end;
-ms-flex-align: end;
align-items: flex-end;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage03__cont {
display: block;
}
}
.c-productsLinkImage03__cont:not(:first-child) {
margin-top: 24px;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage03__cont:not(:first-child) {
margin-top: 12px;
}
}
.c-productsLinkImage03__fig {
-webkit-box-flex: 0;
-ms-flex: 0 0 50%;
flex: 0 0 50%;
margin: 0 10px 0 0;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage03__fig {
max-width: 80%;
margin: 10px auto 0;
}
}
.c-productsLinkImage03__detail {
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage03__detail {
margin: 10px 0 0;
}
}
.c-productsLinkImage03__txt {
font-size: 16px;
line-height: 1.5;
}
@media screen and (max-width: 768px) {
.c-productsLinkImage03__txt {
font-size: 14px;
}
}
.c-productsLinkImage03__txt:not(:only-child) {
margin-bottom: 10px;
}
.c-productsLinkImage03__link__item {
background: #f4f5f6;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-transition: background 0.4s ease;
transition: background 0.4s ease;
}
.c-productsLinkImage03__link__item:not(:first-child) {
margin-top: 10px;
}
@media screen and (min-width: 769px) {
.c-productsLinkImage03__link__item:hover {
background: #d80c24;
}
.c-productsLinkImage03__link__item:hover .c-productsLinkImage03__link__button::before {
color: #fff;
}
.c-productsLinkImage03__link__item:hover .c-productsLinkImage03__link__ttl {
color: #fff;
}
}
.c-productsLinkImage03__link__button {
width: 100%;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.c-productsLinkImage03__link__button::before {
content: "\e902";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 12px;
color: #d80c24;
position: absolute;
top: 50%;
right: 10px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
.c-productsLinkImage03__link__button::after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 12px 12px;
border-color: transparent transparent #d80c24 transparent;
position: absolute;
right: 0;
bottom: 0;
}
.c-productsLinkImage03__link__ctg {
font-size: 16px;
color: #fff;
background: #d80c24;
padding: 10px;
-webkit-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.c-productsLinkImage03__link__ttl {
font-size: 16px;
font-weight: 700;
color: #d80c24;
line-height: 1.2;
text-align: center;
padding: 10px 20px;
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
.c-productsStep {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.c-productsStep {
display: block;
}
}
.c-productsStep:not(:first-child) {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-productsStep:not(:first-child) {
margin-top: 20px;
}
}
.c-productsStep__item {
background: #f4f5f6;
padding: 45px 20px 20px;
-webkit-box-flex: 0;
-ms-flex: 0 0 32%;
flex: 0 0 32%;
counter-increment: step_num;
position: relative;
}
@media screen and (min-width: 769px) {
.c-productsStep__item:not(:nth-child(3n+1)) {
margin-left: 2%;
}
.c-productsStep__item:nth-child(n+4) {
margin-top: 2%;
}
}
@media screen and (max-width: 768px) {
.c-productsStep__item {
padding: 35px 20px 20px;
}
.c-productsStep__item:not(:first-child) {
margin-top: 20px;
}
}
.c-productsStep__item::before {
content: counter(step_num);
font-size: 20px;
font-weight: 700;
color: #fff;
background: #8f99a3;
width: 38px;
height: 38px;
position: absolute;
top: 0;
left: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
@media screen and (max-width: 768px) {
.c-productsStep__item::before {
font-size: 14px;
width: 30px;
height: 30px;
}
}
.c-productsStep__fig__main {
width: 100%;
max-width: 212px;
margin: 0 auto;
overflow: hidden;
position: relative;
}
.c-productsStep__fig__main__inner {
padding-top: 62.7%;
}
.c-productsStep__fig__main__img {
-o-object-fit: contain;
object-fit: contain;
width: 100%;
height: 100%;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.c-productsStep__fig {
text-align: center;
width: 100%;
}
.c-productsStep__fig:not(:first-child) {
margin-top: 10px;
}
.c-productsStep__txt {
font-size: 16px;
line-height: 1.56;
}
@media screen and (max-width: 768px) {
.c-productsStep__txt {
font-size: 14px;
}
}
.c-productsStep__txt:not(:first-child) {
margin-top: 16px;
}
.c-productsStep__txt__link {
color: #d80c24;
text-decoration: underline;
}
@media screen and (min-width: 769px) {
.c-productsStep__txt__link:hover {
text-decoration: none;
}
}
.c-productsStep__note {
font-size: 14px;
line-height: 1.4;
}
@media screen and (max-width: 768px) {
.c-productsStep__note {
font-size: 12px;
}
}
.c-productsStep__note:not(:first-child) {
margin-top: 5px;
}
.c-productsSupplement {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
@media screen and (max-width: 768px) {
.c-productsSupplement {
display: block;
}
}
.c-productsSupplement__cont {
background: #f9f5f2;
padding: 26px;
}
@media screen and (max-width: 768px) {
.c-productsSupplement__cont {
max-width: none;
padding: 20px;
}
}
.c-productsSupplement__dl {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.c-productsSupplement__dt {
font-size: 16px;
line-height: 1.2;
-webkit-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
}
@media screen and (max-width: 768px) {
.c-productsSupplement__dt {
font-size: 14px;
}
}
.c-productsSupplement__dd {
font-size: 18px;
font-weight: 700;
color: #d80c24;
line-height: 1.2;
}
@media screen and (max-width: 768px) {
.c-productsSupplement__dd {
font-size: 14px;
}
}
.c-productsSupplement__fig {
margin: 0 0 0 32px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
@media screen and (max-width: 768px) {
.c-productsSupplement__fig {
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
margin: 10px auto 0;
}
}
@media screen and (max-width: 768px) {
.c-productsSupplement__fig__item {
-webkit-box-flex: 0;
-ms-flex: 0 0 49%;
flex: 0 0 49%;
}
}
.c-productsSupplement__fig__item:not(:first-child) {
margin-left: 2%;
}
.c-productsMovie {
max-width: 800px;
margin: 0 auto;
}
.c-productsMovie:not(:first-child) {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-productsMovie:not(:first-child) {
margin-top: 20px;
}
}
.c-productsMovie__item {
width: 100%;
height: 0;
padding-top: 56.25%;
position: relative;
overflow: hidden;
}
.c-productsMovie__item iframe {
width: 100%;
height: 100%;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.c-productsMovieLink {
max-width: 600px;
margin: 0 auto;
}
.c-productsMovieLink:not(:first-child) {
margin-top: 100px;
}
@media screen and (max-width: 768px) {
.c-productsMovieLink:not(:first-child) {
margin-top: 50px;
}
}
.c-productsMovieLink__button {
background: #f4f5f6;
border: 1px solid #d4d4d4;
padding: 40px 32px;
display: block;
-webkit-transition: color 0.4s ease, background 0.4s ease, border 0.4s ease;
transition: color 0.4s ease, background 0.4s ease, border 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsMovieLink__button {
padding: 16px;
}
}
@media screen and (min-width: 769px) {
.c-productsMovieLink__button:hover {
color: #fff;
background: #d80c24;
border-color: #d80c24;
}
}
.c-productsMovieLink__txt {
font-size: 20px;
font-weight: 700;
line-height: 1.2;
letter-spacing: 0.12em;
padding: 0 80px 0 0;
position: relative;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsMovieLink__txt {
font-size: 15px;
padding: 0 50px 0 0;
}
}
.c-productsMovieLink__txt::before, .c-productsMovieLink__txt::after {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
}
.c-productsMovieLink__txt::before {
content: "";
background: #fff;
border-radius: 5px;
width: 66.5px;
height: 53.2px;
right: 0;
}
@media screen and (max-width: 768px) {
.c-productsMovieLink__txt::before {
width: 47.5px;
height: 38px;
}
}
.c-productsMovieLink__txt::after {
content: "";
background: url(//kagaku.shikoku.co.jp/wp/wp-content/themes/shikoku/assets/img/common/icon-movie.png) no-repeat center center/contain;
width: 46.9px;
height: 32.9px;
right: 10px;
z-index: 10;
}
@media screen and (max-width: 768px) {
.c-productsMovieLink__txt::after {
width: 33.5px;
height: 23.5px;
right: 7px;
}
}
.c-productsBanner:not(:first-child) {
margin-top: 100px;
}
@media screen and (max-width: 768px) {
.c-productsBanner:not(:first-child) {
margin-top: 50px;
}
}
.c-productsBanner__list__item:not(:first-child) {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-productsBanner__list__item:not(:first-child) {
margin-top: 20px;
}
}
.c-productsBanner__list__link {
border: 4px solid #d80c24;
padding: 40px 80px;
display: block;
position: relative;
-webkit-transition: background 0.4s ease;
transition: background 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsBanner__list__link {
border-width: 2px;
padding: 20px;
}
}
.c-productsBanner__list__link::after {
content: "";
position: absolute;
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 15px 15px;
border-color: transparent transparent #d80c24 transparent;
bottom: 0;
right: 0;
}
@media screen and (max-width: 768px) {
.c-productsBanner__list__link::after {
border-width: 0 0 10px 10px;
}
}
@media screen and (min-width: 769px) {
.c-productsBanner__list__link:hover {
background: #d80c24;
}
.c-productsBanner__list__link:hover .c-productsBanner__list__link__ttl {
color: #fff;
}
.c-productsBanner__list__link:hover .c-productsBanner__list__link__txt {
color: #fff;
}
}
.c-productsBanner__list__link__ttl {
font-size: 36px;
font-weight: 700;
color: #d80c24;
text-align: center;
display: block;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsBanner__list__link__ttl {
font-size: 20px;
}
}
.c-productsBanner__list__link__txt {
font-size: 18px;
line-height: 1.8;
letter-spacing: 0.08em;
margin: 20px 0 0;
display: block;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsBanner__list__link__txt {
font-size: 14px;
margin: 10px 0 0;
}
}
.c-productsBanner__list__linkBnr {
display: block;
-webkit-transition: opacity 0.4s ease;
transition: opacity 0.4s ease;
}
@media screen and (min-width: 769px) {
.c-productsBanner__list__linkBnr:hover {
opacity: 0.6;
}
}
.c-productsFeature:not(:first-child) {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-productsFeature:not(:first-child) {
margin-top: 20px;
}
}
.c-productsFeature__list {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.c-productsFeature__list {
display: block;
}
}
.c-productsFeature__list__item {
background: #f9f5f2;
}
@media screen and (max-width: 768px) {
.c-productsFeature__list__item:not(:first-child) {
margin-top: 10px;
}
}
.c-productsFeature__list__item--col--2 {
-webkit-box-flex: 0;
-ms-flex: 0 0 48%;
flex: 0 0 48%;
}
@media screen and (min-width: 769px) {
.c-productsFeature__list__item--col--2:nth-child(even) {
margin-left: 4%;
}
.c-productsFeature__list__item--col--2:nth-child(n+3) {
margin-top: 4%;
}
}
.c-productsFeature__list__ttl {
text-align: center;
background: #d80c24;
padding: 16px;
}
.c-productsFeature__list__ttl__main {
font-size: 22px;
font-weight: 700;
color: #fff;
}
@media screen and (max-width: 768px) {
.c-productsFeature__list__ttl__main {
font-size: 18px;
}
}
.c-productsFeature__list__txt {
font-size: 16px;
line-height: 1.56;
letter-spacing: 0.12em;
padding: 18px;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsFeature__list__txt {
font-size: 14px;
}
}
.c-productsSignList:not(:first-child) {
margin-top: 40px;
}
@media screen and (max-width: 768px) {
.c-productsSignList:not(:first-child) {
margin-top: 20px;
}
}
.c-productsSignList__main {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
.c-productsSignList__main {
display: block;
}
}
.c-productsSignList__main__item {
border: 2px solid #d80c24;
}
.c-productsSignList__main__item--col--3 {
-webkit-box-flex: 0;
-ms-flex: 0 0 32%;
flex: 0 0 32%;
}
@media screen and (min-width: 769px) {
.c-productsSignList__main__item--col--3:not(:nth-child(3n+1)) {
margin-left: 2%;
}
.c-productsSignList__main__item--col--3:nth-child(n+4) {
margin-top: 2%;
}
}
@media screen and (max-width: 768px) {
.c-productsSignList__main__item--col--3:not(:first-child) {
margin-top: 10px;
}
}
.c-productsSignList__main__item--col--4 {
-webkit-box-flex: 0;
-ms-flex: 0 0 23%;
flex: 0 0 23%;
}
@media screen and (min-width: 769px) {
.c-productsSignList__main__item--col--4:not(:nth-child(4n+1)) {
margin-left: 2%;
}
.c-productsSignList__main__item--col--4:nth-child(n+5) {
margin-top: 2%;
}
}
@media screen and (max-width: 768px) {
.c-productsSignList__main__item--col--4:not(:first-child) {
margin-top: 10px;
}
}
.c-productsSignList__main__link {
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-transition: background 0.4s ease;
transition: background 0.4s ease;
}
a.c-productsSignList__main__link {
position: relative;
}
a.c-productsSignList__main__link .c-productsSignList__ttl {
position: relative;
}
a.c-productsSignList__main__link .c-productsSignList__ttl::after {
content: "\e902";
font-family: "icomoon" !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 15px;
position: absolute;
top: 50%;
right: 10px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: right 0.4s ease;
transition: right 0.4s ease;
}
@media screen and (max-width: 768px) {
a.c-productsSignList__main__link .c-productsSignList__ttl::after {
font-size: 12px;
}
}
a.c-productsSignList__main__link::before {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 16px 16px;
border-color: transparent transparent #fff transparent;
position: absolute;
right: -2px;
bottom: -2px;
z-index: 10;
}
a.c-productsSignList__main__link::after {
content: "";
width: 0;
height: 0;
border-style: solid;
border-width: 0 0 15px 15px;
border-color: transparent transparent #d80c24 transparent;
position: absolute;
right: 0;
bottom: 0;
}
@media screen and (min-width: 769px) {
a.c-productsSignList__main__link:hover {
background: #d80c24;
}
a.c-productsSignList__main__link:hover .c-productsSignList__main__fig__img {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}
a.c-productsSignList__main__link:hover .c-productsSignList__ttl {
color: #fff;
}
a.c-productsSignList__main__link:hover .c-productsSignList__ttl::after {
right: 5px;
}
}
.c-productsSignList__main__heading {
background: #f4f5f6;
text-align: center;
padding: 10px;
}
.c-productsSignList__main__heading__inner {
font-size: 18px;
font-weight: 700;
color: #d80c24;
}
.c-productsSignList__main__fig {
background: #fff;
width: 100%;
padding: 20px;
position: relative;
-webkit-box-flex: 1;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
@media screen and (max-width: 768px) {
.c-productsSignList__main__fig {
padding: 10px;
}
}
.c-productsSignList__main__fig__inner {
height: 120px;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsSignList__main__fig__inner {
height: 100px;
}
}
.c-productsSignList__main__fig__img {
width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
overflow: hidden;
-webkit-transition: -webkit-transform 0.4s ease;
transition: -webkit-transform 0.4s ease;
transition: transform 0.4s ease;
transition: transform 0.4s ease, -webkit-transform 0.4s ease;
}
.c-productsSignList__ttl {
background: #f4f5f6;
color: #d80c24;
line-height: 1.44;
text-align: center;
height: 100%;
padding: 20px;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-transition: color 0.4s ease;
transition: color 0.4s ease;
}
@media screen and (max-width: 768px) {
.c-productsSignList__ttl {
padding: 10px 20px;
}
}
.c-productsSignList__ttl__main {
font-size: 16px;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsSignList__ttl__main {
font-size: 20px;
}
}
.c-productsSignList__ttl__sub {
font-family: YakuHanMP, "Rajdhani", "Noto Serif JP", "Yu Mincho", YuMincho, "Hiragino Mincho ProN", serif;
font-size: 14px;
font-weight: 600;
margin: 10px 0 0;
display: block;
}
@media screen and (max-width: 768px) {
.c-productsSignList__ttl__sub {
font-size: 12px;
margin: 5px 0 0;
}
}
.lang-en * {
letter-spacing: 0.05em;
}