@charset "UTF-8";
@font-face {
font-family : "UniNeueHeavy";
src : url("../webFonts/UniNeueHeavy/font.woff2") format("woff2"), url("../webFonts/UniNeueHeavy/font.woff") format("woff");
}
@font-face {
font-family : "UniNeueBold";
src : url("../webFonts/UniNeueBold/font.woff2") format("woff2"), url("../webFonts/UniNeueBold/font.woff") format("woff");
}
@font-face {
font-family : "UniNeueRegular";
src : url("../webFonts/UniNeueRegular/font.woff2") format("woff2"), url("../webFonts/UniNeueRegular/font.woff") format("woff");
}
@font-face {
font-family : "UniNeueBook";
src : url("../webFonts/UniNeueBook/font.woff2") format("woff2"), url("../webFonts/UniNeueBook/font.woff") format("woff");
}
/* basic - foundation
--------------------------------------------------------- */
html , body , div , span , object , iframe , h1 , h2 , h3 , h4 , h5 , h6 , p , a , 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 , canvas , details , figcaption , figure , footer , header , menu , nav , section , summary , time , mark , audio , video {
margin : 0;
padding : 0;
border : 0;
outline : 0;
font-size : 100%;
vertical-align : baseline;
background : transparent;
}
html {
font-size : 62.5%;
}
body {
font-family : "BIZ UDPGothic", sans-serif;
font-weight : 400;
color : #25282a;
text-size-adjust : 100%;
font-feature-settings : "palt" 1;
letter-spacing : 0.1em;
vertical-align : baseline;
font-size : 16px;
font-size : 1.6rem;
word-wrap : break-word;
}
article , aside , details , figcaption , figure , main , footer , header , menu , nav , section {
display : block;
}
h1 , h2 , h3 , h4 , h5 , h6 {
word-break : break-word;
line-break : strict;
overflow-wrap : break-word;
word-wrap : break-word;
font-weight : 400;
}
ul , ol {
list-style : none;
}
span {
font-weight : inherit;
}
blockquote , q {
quotes : none;
}
blockquote:before , blockquote:after , q:before , q:after {
content : "";
content : none;
}
a {
cursor : pointer;
color : inherit;
transition : all 0.15s ease-out;
}
a[class] {
text-decoration : none;
}
address {
font-style : normal;
}
table {
width : 100%;
table-layout : fixed;
border-collapse : collapse;
border-spacing : 0;
}
img {
max-width : 100%;
height : auto;
vertical-align : top;
}
input[type=text] , input[type=email] , input[type=tel] , textarea , button , select , option {
display : block;
width : 100%;
max-width : 100%;
font-family : inherit;
outline : none;
border : 0;
border-radius : 0;
background : transparent;
margin : 0;
padding : 0;
}
input[type=text] , input[type=email] , input[type=tel] , textarea , button , select {
-webkit-appearance : none;
-moz-appearance : none;
appearance : none;
outline : none;
}
input[type=radio] , input[type=checkbox] {
margin : 0;
padding : 0;
vertical-align : middle;
}
textarea {
resize : vertical;
}
button {
cursor : pointer;
}
/* wrapper - layout
--------------------------------------------------------- */
body.is-fixed {
overflow : hidden;
}
/* breadcrumb - layout
--------------------------------------------------------- */
.l-breadcrumb {
width : 100%;
margin-left : auto;
margin-right : auto;
padding-left : 15px;
padding-right : 15px;
margin-top : 60px;
display : none;
box-sizing : border-box;
overflow-x : auto;
}
@media screen and (min-width: 768px) {
.l-breadcrumb {
display : block;
}
}
@media screen and (min-width: 1024px) {
.l-breadcrumb {
max-width : 1366px;
padding-left : 128px;
padding-right : 128px;
margin-top : 78px;
}
}
.l-breadcrumb .l-breadcrumb-list {
display : flex;
justify-content : flex-start;
padding-top : 16px;
padding-bottom : 16px;
}
@media screen and (min-width: 1024px) {
.l-breadcrumb .l-breadcrumb-list {
padding-top : 40px;
padding-bottom : 60px;
}
}
.l-breadcrumb .l-breadcrumb-list__item {
font-size : 13px;
font-size : 1.3rem;
font-weight : 700;
white-space : nowrap;
position : relative;
padding-right : 32px;
}
.l-breadcrumb .l-breadcrumb-list__item:after {
content : "";
display : inline-block;
vertical-align : middle;
width : 0.5em;
height : 0.5em;
border : 1px solid #25282a;
border-left : 0;
border-bottom : 0;
box-sizing : border-box;
transform : translateX(-25%) translateY(-50%) rotate(45deg);
margin-left : 12px;
margin-right : 12px;
position : absolute;
right : 0;
top : 50%;
}
.l-breadcrumb .l-breadcrumb-list__item:last-of-type {
text-overflow : ellipsis;
overflow : hidden;
padding-right : 0;
}
.l-breadcrumb .l-breadcrumb-list__item:last-of-type:after {
background : none;
display : none;
}
.l-breadcrumb .l-breadcrumb-list__link {
opacity : 0.5;
font-weight : 400;
}
.l-breadcrumb .l-breadcrumb-list__link:hover {
opacity : 1;
}
/* container - layout
--------------------------------------------------------- */
/* content - layout
--------------------------------------------------------- */
.l-content {
position : relative;
margin-left : auto;
margin-right : auto;
padding-left : 15px;
padding-right : 15px;
max-width : calc(100% - 30px);
}
@media screen and (min-width: 1024px) {
.l-content {
max-width : 1110px;
padding-left : 128px;
padding-right : 128px;
}
}
@media screen and (min-width: 1024px) {
.l-content.is-col2 {
display : flex;
justify-content : space-between;
}
}
.l-content__main {
margin-bottom : 96px;
}
@media screen and (min-width: 1024px) {
.l-content__main {
flex : 0 0 auto;
width : 730px;
margin-bottom : 0;
}
}
@media screen and (min-width: 1024px) {
.l-content__sub {
flex : 0 0 auto;
width : 220px;
margin-left : 96px;
}
}
/* footer - layout
--------------------------------------------------------- */
.l-footer {
width : 100%;
position : relative;
margin-top : -12rem;
}
@media screen and (min-width: 1024px) {
.l-footer {
min-width : 1366px;
}
}
.l-footer:before {
content : "";
display : block;
width : 100%;
height : 12rem;
background-image : url("data:image/svg+xml;utf8,");
background-repeat : no-repeat;
background-position : right top;
background-size : contain;
}
.l-footer-pagetop {
display : none;
position : absolute;
right : 24px;
top : 110px;
z-index : 100;
}
@media screen and (min-width: 1024px) {
.l-footer-pagetop {
right : 32px;
}
}
.l-footer-pagetop .l-footer-pagetop__link {
background-image : url("data:image/svg+xml;utf8,");
background-repeat : no-repeat;
background-position : center center;
background-size : 12px 14px;
width : 36px;
height : 36px;
display : inline-block;
background-color : #ffffff;
border-radius : 50%;
border : 2px solid #25282a;
box-sizing : border-box;
}
.l-footer-pagetop.is-fixed {
position : fixed;
bottom : 24px;
top : auto;
}
@media screen and (min-width: 1024px) {
.l-footer-pagetop.is-fixed {
bottom : 32px;
}
}
.l-footer-contact-button {
display : none;
position : fixed;
bottom : 24px;
left : 24px;
z-index : 100;
}
.l-footer-contact-button .c-button {
font-size : 12px;
font-size : 1.2rem;
padding : 1.2em 1.8em 1.2em 4em;
}
.l-footer-contact-button .c-button:before {
content : "";
position : absolute;
top : 50%;
transform : translateY(-50%);
left : 1.8em;
background-image : url("../img/common/icon_contact.svg");
background-repeat : no-repeat;
background-position : left center;
background-size : 1.8rem 1.6rem;
width : 1.8rem;
height : 1.6rem;
display : inline-block;
}
.l-footer-contact-button.is-active {
display : block;
}
.l-footer-floating-banner {
display : none;
background-color : #25282a;
border : 1px solid #ffffff;
bottom : -1px;
left : 128px;
z-index : 1;
color : #ffffff;
text-align : center;
padding : 15px;
border-radius : 15px 15px 0 0;
box-shadow : 0 0 32px 0 rgba(0, 0, 0, 0.2);
}
@media screen and (min-width: 1921px) {
.l-footer-floating-banner.is-fixed {
position : fixed;
display : block;
}
}
.l-footer-floating-banner .l-footer-floating-banner__logo {
margin-bottom : 15px;
}
.l-footer-floating-banner .l-footer-floating-banner-list {
display : flex;
}
.l-footer-floating-banner .l-footer-floating-banner-list .l-footer-floating-banner-list__item {
font-size : 12px;
font-size : 1.2rem;
}
.l-footer-floating-banner .l-footer-floating-banner-list .l-footer-floating-banner-list__item:after {
content : "/";
display : inline-block;
}
.l-footer-floating-banner .l-footer-floating-banner-list .l-footer-floating-banner-list__item:last-child:after {
content : "";
}
.l-footer__inner {
width : 100%;
background-color : #25282a;
padding-top : 80px;
padding-bottom : 116px;
position : relative;
background-image : url("../img/common/bg_curve-line.svg");
background-repeat : no-repeat;
background-position : right top 16px;
background-size : 15.8rem 14.8rem;
}
@media screen and (min-width: 1024px) {
.l-footer__inner {
padding-bottom : 32px;
}
}
.l-footer__inner:before {
content : "";
display : block;
width : calc(100% - 15.8rem);
height : 1px;
background-image : url("../img/common/bg_line.svg");
background-repeat : repeat-x;
background-position : left top;
background-size : contain;
position : absolute;
left : 0;
top : 16px;
}
.l-footer-content {
color : #ffffff;
letter-spacing : 0;
padding-left : 15px;
padding-right : 15px;
}
.l-footer-content .l-footer-content__inner {
margin-left : auto;
margin-right : auto;
display : flex;
flex-direction : column;
flex-wrap : wrap;
justify-content : center;
}
@media screen and (min-width: 1024px) {
.l-footer-content .l-footer-content__inner {
flex-direction : row;
width : 1110px;
justify-content : flex-start;
}
}
.l-footer-sns-list {
display : flex;
justify-content : center;
column-gap : 16px;
margin-bottom : 32px;
}
@media screen and (min-width: 1024px) {
.l-footer-sns-list {
order : 1;
margin-left : auto;
}
}
.l-footer-sns-list .l-footer-sns-list__icon {
fill : #ffffff;
width : 32px;
height : 32px;
}
.l-footer-nav {
width : 58.13vw;
margin-left : auto;
margin-right : auto;
margin-bottom : 36px;
}
@media screen and (min-width: 1024px) {
.l-footer-nav {
width : auto;
margin-left : 0;
margin-right : 0;
order : 0;
margin-bottom : 150px;
}
}
.l-footer-nav-group {
display : flex;
flex-wrap : wrap;
flex-direction : column;
font-size : 13px;
font-size : 1.3rem;
}
@media screen and (min-width: 1024px) {
.l-footer-nav-group {
column-gap : 48px;
width : 100%;
flex-direction : row;
order : 0;
}
}
.l-footer-nav-list .l-footer-nav-list__parent {
position : relative;
}
.l-footer-nav-list .l-footer-nav-list__parent:after {
content : "";
display : block;
background-image : url("data:image/svg+xml;utf8,");
background-repeat : no-repeat;
background-position : center center;
background-size : contain;
width : 10px;
height : 6px;
position : absolute;
right : 0;
top : 50%;
}
@media screen and (min-width: 1024px) {
.l-footer-nav-list .l-footer-nav-list__parent:after {
background-image : none;
}
}
.l-footer-nav-list .l-footer-nav-list__parent.is-open:after {
transform : translateY(-50%) rotateZ(180deg);
}
.l-footer-nav-list .l-footer-nav-list__item {
padding-top : 8px;
padding-bottom : 8px;
}
@media screen and (min-width: 1024px) {
.l-footer-nav-list .l-footer-nav-list__item {
margin-bottom : 24px;
padding-top : 0;
padding-bottom : 0;
}
.l-footer-nav-list .l-footer-nav-list__item:last-child {
margin-bottom : 0;
}
}
.l-footer-nav-child-wrap {
display : none;
}
@media screen and (min-width: 1024px) {
.l-footer-nav-child-wrap {
display : block;
}
}
.l-footer-nav-child {
color : rgba(255, 255, 255, 0.5);
margin-top : 1em;
margin-bottom : 1em;
}
@media screen and (min-width: 1024px) {
.l-footer-nav-child {
margin-top : 24px;
}
}
.l-footer-nav-child .l-footer-nav-child__item {
margin-bottom : 1em;
}
.l-footer-nav-child .l-footer-nav-child__item:last-child {
margin-bottom : 0;
}
.l-footer-nav-list__item.l-footer-nav-list__store {
margin-top : 40px;
}
@media screen and (min-width: 1024px) {
.l-footer-nav-list__item.l-footer-nav-list__store {
margin-top : 80px;
margin-bottom : 13px;
}
}
.l-footer-store {
color : #ff6a14;
}
.l-footer-store .l-footer-store__link {
width : 100%;
display : inline-block;
background-image : url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2214%22%20height%3D%2210.828%22%20viewBox%3D%220%200%2014%2010.828%22%3E%20%3Cg%20id%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97_6138%22%20data-name%3D%22%E3%82%B0%E3%83%AB%E3%83%BC%E3%83%97%206138%22%20transform%3D%22translate(-1270.02%20-490.236)%22%3E%20%3Cline%20id%3D%22%E7%B7%9A_19%22%20data-name%3D%22%E7%B7%9A%2019%22%20x2%3D%2212%22%20transform%3D%22translate(1271.02%20495.617)%22%20fill%3D%22none%22%20stroke%3D%22%23ed7700%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%2F%3E%20%3Cpath%20id%3D%22%E3%83%91%E3%82%B9_134%22%20data-name%3D%22%E3%83%91%E3%82%B9%20134%22%20d%3D%22M716.608%2C387.713l4-4-4-4%22%20transform%3D%22translate(562.412%20111.937)%22%20fill%3D%22none%22%20stroke%3D%22%23ed7700%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20stroke-width%3D%222%22%2F%3E%20%3C%2Fg%3E%3C%2Fsvg%3E");
background-repeat : no-repeat;
background-position : right center;
}
@media screen and (min-width: 1024px) {
.l-footer-store .l-footer-store__link {
background-image : none;
}
}
.l-footer-repair {
color : #ff6a14;
}
.l-footer-sub {
font-size : 13px;
font-size : 1.3rem;
display : flex;
flex-wrap : wrap;
justify-content : center;
gap : 24px 32px;
color : rgba(255, 255, 255, 0.5);
margin-bottom : 24px;
}
@media screen and (min-width: 1024px) {
.l-footer-sub {
justify-content : flex-start;
margin-bottom : 0;
order : 2;
margin-left : auto;
}
}
.l-footer-copyright {
font-size : 12px;
font-size : 1.2rem;
text-align : center;
}
.l-footer-copyright span {
font-weight : 700;
}
@media screen and (min-width: 1024px) {
.l-footer-copyright {
text-align : left;
order : 1;
}
}
/* header - layout
--------------------------------------------------------- */
.l-header {
position : fixed;
top : 0;
left : 0;
width : 100%;
height : auto;
z-index : 9999;
}
@media screen and (min-width: 1024px) {
.l-header {
min-width : 1366px;
}
}
.l-header {
width : 100%;
height : 60px;
background-color : rgba(255, 255, 255, 0.93);
color : #25282a;
font-weight : 700;
letter-spacing : 0;
overflow-y : auto;
}
@media screen and (min-width: 1024px) {
.l-header {
height : 0;
overflow-y : visible;
}
.l-header:before {
content : "";
background-image : url("../img/header/header_curve.png");
background-repeat : no-repeat;
background-position : right bottom;
background-size : contain;
display : block;
width : 98px;
height : 78px;
position : absolute;
right : 0;
bottom : -78px;
}
.l-header:after {
content : "";
width : calc(100% - 98px);
background-color : rgba(255, 255, 255, 0.93);
border-bottom : 1px solid #25282a;
box-sizing : border-box;
display : block;
height : 78px;
position : absolute;
left : 0;
bottom : -78px;
}
}
.l-header:not(.is-open).is-transparent {
background-color : transparent;
}
@media screen and (min-width: 1024px) {
.l-header:not(.is-open).is-transparent:before , .l-header:not(.is-open).is-transparent:after {
visibility : hidden;
}
}
.l-header-info {
position : relative;
margin-left : auto;
margin-right : auto;
display : flex;
align-items : center;
padding-left : 15px;
padding-right : 15px;
min-height : 60px;
z-index : 100;
}
@media screen and (min-width: 1024px) {
.l-header-info {
padding-left : 128px;
padding-right : 128px;
min-height : 78px;
min-width : 1110px;
background-color : transparent;
}
}
.l-nav-front {
color : #25282a;
display : none;
}
@media screen and (min-width: 1024px) {
.l-nav-front {
display : block;
margin-left : 32px;
}
}
.l-nav-front-group {
display : flex;
font-size : 13px;
font-size : 1.3rem;
font-weight : 700;
letter-spacing : 0;
}
.l-nav-front-group .l-nav-front-group__link {
position : relative;
display : flex;
flex-direction : column;
justify-content : center;
align-items : center;
height : 78px;
}
.l-nav-front-group .l-nav-front-group__link {
padding-left : 16px;
padding-right : 16px;
}
.l-nav-front-group .l-nav-front-group__item:hover .l-nav-front-group__link {
color : #ff6a14;
}
.l-nav-front-group .l-nav-front-group__item:not(.has-no-dropdown):hover .l-nav-front-group__link:after {
content : "";
display : inline-block;
vertical-align : middle;
width : 1.4rem;
height : 1.4rem;
border : 1px solid #25282a;
border-left : 0;
border-bottom : 0;
box-sizing : border-box;
transform : translateX(-50%) rotate(135deg);
position : absolute;
bottom : 8px;
left : 50%;
transition : all 0.25s ease-out;
}
.l-header-store {
margin-left : auto;
}
.l-header-store .l-header-store__button {
font-size : 13px;
font-size : 1.3rem;
min-width : 160px;
border : 1px solid #ff6a14;
background-color : #ff6a14;
color : #ffffff;
}
@media screen and (min-width: 1024px) {
.l-header-store .l-header-store__button {
border : 1px solid #ff6a14;
background-color : #ffffff;
color : #ff6a14;
}
.l-header-store .l-header-store__button:hover {
background-color : #ff6a14;
color : #ffffff;
}
}
.l-nav-button {
position : relative;
flex : 0 0 auto;
border : 0;
padding : 0;
width : 20px;
height : 20px;
margin-left : 15px;
}
@media screen and (min-width: 1024px) {
.l-nav-button {
margin-left : 30px;
}
}
.l-nav-button .l-nav-button__line {
display : block;
width : 20px;
height : 1px;
background : #25282a;
position : absolute;
top : 50%;
left : 50%;
transform : translate(-50%, -50%);
}
.l-nav-button .l-nav-button__line:before , .l-nav-button .l-nav-button__line:after {
content : "";
display : block;
position : absolute;
width : 20px;
height : 1px;
background : #25282a;
transition : transform 0.25s ease-out;
}
.l-nav-button .l-nav-button__line:before {
top : -6px;
}
.l-nav-button .l-nav-button__line:after {
top : 6px;
}
.l-nav-button.is-open .l-nav-button__line {
background : transparent;
}
.l-nav-button.is-open .l-nav-button__line:before {
transform : rotate(-45deg) translateY(0px);
top : 0;
}
.l-nav-button.is-open .l-nav-button__line:after {
transform : rotate(45deg) translateY(0px);
top : 0;
}
.l-nav {
position : relative;
z-index : 9999;
}
.l-nav-group {
display : flex;
flex-direction : column;
width : calc(100% - 30px);
margin-left : auto;
margin-right : auto;
}
@media screen and (min-width: 1024px) {
.l-nav-group {
flex-direction : row;
column-gap : 46px;
width : auto;
min-width : 1110px;
padding-left : 128px;
padding-right : 128px;
padding-top : 58px;
padding-bottom : 48px;
}
}
.l-nav-group .l-nav-group__item {
flex : 0 0 auto;
border-bottom : 1px solid #707070;
}
.l-nav-group .l-nav-group__item:last-child {
border-bottom : 0;
}
@media screen and (min-width: 1024px) {
.l-nav-group .l-nav-group__item {
border-bottom : 0;
}
}
.l-nav-list {
font-size : 16px;
font-size : 1.6rem;
}
.l-nav-list .l-nav-list__item {
padding-top : 24px;
padding-bottom : 24px;
}
@media screen and (min-width: 1024px) {
.l-nav-list .l-nav-list__item {
padding-top : 0;
padding-bottom : 0;
}
}
.l-nav-list .l-nav-list__link:hover {
color : #ff6a14;
}
.l-nav-list .l-nav-list__parent {
position : relative;
}
@media screen and (min-width: 1024px) {
.l-nav-list .l-nav-list__parent {
margin-bottom : 24px;
}
}
.l-nav-list .l-nav-list__parent:after {
content : "";
display : block;
background-image : url("data:image/svg+xml;utf8,");
background-repeat : no-repeat;
background-position : center center;
background-size : contain;
width : 18px;
height : 22px;
transform : translateY(-50%);
position : absolute;
right : 0;
top : 50%;
}
@media screen and (min-width: 1024px) {
.l-nav-list .l-nav-list__parent:after {
display : none;
}
}
.l-nav-list .l-nav-list__parent.is-open:after {
transform : translateY(-50%) rotateZ(180deg);
}
.l-nav-child-wrap {
padding-left : 64px;
padding-top : 24px;
display : none;
}
@media screen and (min-width: 1024px) {
.l-nav-child-wrap {
display : block;
padding-left : 0;
padding-top : 0;
}
}
.l-nav-child {
font-size : 13px;
font-size : 1.3rem;
}
.l-nav-child .l-nav-child__item {
margin-bottom : 1em;
}
.l-nav-child .l-nav-child__item:last-child {
margin-bottom : 0;
}
.l-nav-child .l-nav-child__link:hover {
color : #ff6a14;
}
.l-nav-list__online-store {
display : none;
flex : 0 0 auto;
}
@media screen and (min-width: 1024px) {
.l-nav-list__online-store {
display : block;
margin-bottom : 24px;
}
}
.l-nav-list__store {
display : none;
flex : 0 0 auto;
}
@media screen and (min-width: 1024px) {
.l-nav-list__store {
display : block;
margin-bottom : 24px;
}
}
.l-nav-list__repair {
display : none;
flex : 0 0 auto;
}
@media screen and (min-width: 1024px) {
.l-nav-list__repair {
display : block;
}
}
.l-sub-nav-wrap {
padding-top : 24px;
padding-bottom : 24px;
}
@media screen and (min-width: 1024px) {
.l-sub-nav-wrap {
display : none;
}
}
.l-sub-nav-list {
font-size : 13px;
font-size : 1.3rem;
}
.l-sub-nav-list .l-sub-nav-list__item {
margin-bottom : 1.5em;
}
.l-sub-nav-list .l-sub-nav-list__item:last-child {
margin-bottom : 0;
}
.l-nav-dropdown {
width : 100%;
position : absolute;
left : 0;
}
.l-nav-dropdown__inner {
width : 100%;
min-width : 1110px;
padding-top : 56px;
padding-bottom : 48px;
padding-left : 128px;
padding-right : 128px;
display : flex;
box-sizing : border-box;
}
.l-nav-dropdown-title {
flex : 0 0 auto;
width : 286px;
}
.l-nav-dropdown-title .l-nav-dropdown-title__sub {
font-size : 13px;
font-size : 1.3rem;
font-weight : normal;
color : #ff6a14;
margin-bottom : 8px;
}
.l-nav-dropdown-title .l-nav-dropdown-title__main {
font-size : 22px;
font-size : 2.2rem;
font-weight : 700;
}
.l-nav-dropdown-title .l-nav-dropdown-title__main .l-nav-dropdown-title__main__small {
font-size : 16px;
font-size : 1.6rem;
}
.l-nav-dropdown__list {
flex : 0 0 auto;
display : flex;
flex-wrap : wrap;
gap : 24px 0;
width : 855px;
}
.l-nav-dropdown__list .l-nav-dropdown__item {
flex : 0 0 auto;
width : 285px;
}
.l-nav-dropdown__list .l-nav-dropdown__link {
display : flex;
align-items : center;
}
.l-nav-dropdown__list .l-nav-dropdown__img {
flex : 0 0 auto;
width : 90px;
margin-right : 16px;
border-radius : 3px;
overflow : hidden;
}
.l-nav-dropdown__list .l-nav-dropdown__img--border {
position : relative;
}
.l-nav-dropdown__list .l-nav-dropdown__img--border:after {
content : "";
width : 100%;
height : 100%;
position : absolute;
left : 0;
top : 0;
border : 1px solid #25282a;
border-radius : 3px;
box-sizing : border-box;
z-index : 1;
}
.l-nav-dropdown__list .l-nav-dropdown__text {
font-size : 13px;
font-size : 1.3rem;
font-weight : 700;
line-height : 1.4;
}
.l-nav-dropdown__list .l-nav-dropdown__link:hover .l-nav-dropdown__text {
color : #ff6a14;
}
.l-header {
transition : height 0.35s ease-out;
}
.l-header.is-open {
height : 100vh;
height : 100dvh;
}
@media screen and (min-width: 1024px) {
.l-header.is-open {
height : auto;
}
}
.l-nav-front-group__item .l-nav-dropdown {
animation-name : dropdownAnime;
animation-duration : 0.45s;
animation-timing-function : linear;
animation-delay : 0;
animation-iteration-count : 1;
display : none;
}
.l-nav-front-group__item.is-open .l-nav-dropdown {
display : block;
}
.l-nav {
animation-name : dropdownAnime;
animation-duration : 0.45s;
animation-timing-function : linear;
animation-delay : 0;
animation-iteration-count : 1;
display : none;
}
.l-nav.is-open {
display : block;
}
@keyframes dropdownAnime {
0% {
opacity : 0;
}
100% {
opacity : 1;
}
}
/* inner - layout
--------------------------------------------------------- */
.l-inner {
margin-left : auto;
margin-right : auto;
width : 100%;
}
@media screen and (min-width: 768px) {
.l-inner {
max-width : 730px;
}
}
@media screen and (min-width: 1024px) {
.l-inner {
padding-left : 190px;
padding-right : 190px;
}
}
/* main - layout
--------------------------------------------------------- */
.l-main {
width : 100%;
display : block;
position : relative;
flex : 1 0 auto;
}
/* wrapper - layout
--------------------------------------------------------- */
.l-wrapper {
width : 100%;
min-height : 100vh;
height : 100%;
display : flex;
flex-direction : column;
position : relative;
overflow-x : hidden;
}
.l-wrapper.is-fixed {
position : fixed;
}
@media screen and (min-width: 1024px) {
.l-wrapper.is-fixed {
position : relative;
}
}
.l-wrapper--bg {
position : fixed;
top : 0;
left : -72vw;
display : block;
width : 200vw;
height : 240vh;
z-index : -1;
background-image : url("../img/common/corner_left_bottom.svg");
background-repeat : no-repeat;
background-position : 0 0;
background-size : cover;
}
@media screen and (min-width: 768px) {
.l-wrapper--bg {
top : 0;
left : -30vw;
}
}
@media screen and (min-width: 1024px) {
.l-wrapper--bg {
top : 0;
left : 0;
}
}
/* archive - component - object
--------------------------------------------------------- */
.c-archive .c-archive-item {
font-size : 16px;
font-size : 1.6rem;
display : flex;
flex-wrap : wrap;
align-items : center;
margin-bottom : 40px;
}
.c-archive .c-archive-item .c-archive-item__date {
width : 100%;
display : block;
}
@media screen and (min-width: 768px) {
.c-archive .c-archive-item .c-archive-item__date {
width : auto;
display : inline-block;
}
}
.c-archive .c-archive-item .c-archive-item__category {
display : flex;
flex-wrap : wrap;
gap : 8px;
margin-top : 10px;
}
@media screen and (min-width: 768px) {
.c-archive .c-archive-item .c-archive-item__category {
margin-left : 20px;
margin-top : 0;
}
}
.c-archive .c-archive-item .c-archive-item__title {
width : 100%;
margin-top : 1.6rem;
line-height : 1.6;
}
.c-archive .c-archive-item .c-archive-item__title a:hover {
text-decoration : none;
}
.c-archive .c-archive-item:last-of-type {
margin-bottom : 0;
}
.c-archive .c-archive-label {
display : inline-block;
background-color : #25282a;
color : #ffffff;
font-size : 13px;
font-size : 1.3rem;
font-weight : 700;
padding : 0 0.8em;
line-height : 1.65;
}
.c-archive-media .c-archive-media-item {
display : flex;
flex-direction : column;
align-items : flex-start;
margin-bottom : 30px;
}
@media screen and (min-width: 768px) {
.c-archive-media .c-archive-media-item {
flex-direction : row;
align-items : center;
}
}
.c-archive-media .c-archive-media-item .c-archive-media-item__img {
margin-bottom : 24px;
}
@media screen and (min-width: 768px) {
.c-archive-media .c-archive-media-item .c-archive-media-item__img {
flex : 0 0 350px;
margin-bottom : 0;
}
}
.c-archive-media .c-archive-media-item:last-child {
margin-bottom : 0;
}
@media screen and (min-width: 768px) {
.c-archive-media .c-archive-media-item__caption {
margin-left : 36px;
}
}
.c-archive-media .c-archive-media-item__label {
display : inline-block;
background-color : #25282a;
color : #ffffff;
font-size : 16px;
font-size : 1.6rem;
font-weight : 700;
padding : 0 0.8em;
margin-bottom : 12px;
line-height : 1.65;
}
.c-archive-media .c-archive-media-item__main {
font-size : 22px;
font-size : 2.2rem;
font-weight : 700;
margin-bottom : 8px;
}
.c-archive-media .c-archive-media-item__sub {
font-size : 16px;
font-size : 1.6rem;
font-weight : 700;
line-height : 1.6;
}
.c-archive-media .c-archive-media-item__text {
font-size : 16px;
font-size : 1.6rem;
line-height : 1.6;
margin-top : 16px;
}
.c-archive-media .c-archive-media-item__button {
margin-top : 22px;
font-size : 13px;
font-size : 1.3rem;
}
.c-archive-card {
display : flex;
flex-wrap : wrap;
gap : 30px;
}
@media screen and (min-width: 768px) {
.c-archive-card {
gap : 96px 30px;
}
}
.c-archive-card .c-archive-card-item {
display : flex;
flex-direction : column;
}
@media screen and (min-width: 768px) {
.c-archive-card .c-archive-card-item {
width : calc((100% - 60px) / 3);
}
}
.c-archive-card .c-archive-card-item__head {
margin-bottom : 16px;
}
.c-archive-card .c-archive-card-item__img {
margin-top : auto;
margin-bottom : 20px;
}
.c-archive-card .c-archive-card-item__label {
display : inline-block;
background-color : #25282a;
color : #ffffff;
font-size : 16px;
font-size : 1.6rem;
font-weight : 700;
padding : 0 0.8em;
margin-bottom : 12px;
line-height : 1.65;
}
.c-archive-card .c-archive-card-item__main {
font-size : 22px;
font-size : 2.2rem;
line-height : 1.4;
font-weight : 700;
}
.c-archive-card .c-archive-card-item__text {
font-size : 16px;
font-size : 1.6rem;
line-height : 1.6;
}
.c-archive-card .c-archive-card-item__button {
margin-top : 22px;
font-size : 13px;
font-size : 1.3rem;
}
.c-archive-navi .c-archive-navi__item {
font-size : 16px;
font-size : 1.6rem;
font-family : "UniNeueRegular", "BIZ UDPGothic", sans-serif;
line-height : 2;
border-bottom : 1px solid #25282a;
margin-bottom : 18px;
}
.c-archive-navi .c-archive-navi__item:last-child {
margin-bottom : 0;
}
.c-archive-navi .c-archive-navi__link {
display : flex;
}
.c-archive-navi .c-archive-navi__link:hover {
color : #ff6a14;
}
.c-archive-navi .c-archive-navi__count {
margin-left : auto;
}
/* article - component - object
--------------------------------------------------------- */
.c-article {
padding-top : 84px;
}
@media screen and (min-width: 1024px) {
.c-article {
padding-top : 64px;
}
}
.c-article .c-article-head {
display : flex;
flex-wrap : wrap;
align-items : center;
margin-bottom : 40px;
}
.c-article .c-article-head .c-article-head__date {
font-size : 16px;
font-size : 1.6rem;
width : 100%;
}
@media screen and (min-width: 768px) {
.c-article .c-article-head .c-article-head__date {
width : auto;
}
}
.c-article .c-article-head .c-article-head__category {
display : flex;
flex-wrap : wrap;
gap : 8px;
margin-top : 10px;
}
@media screen and (min-width: 768px) {
.c-article .c-article-head .c-article-head__category {
margin-left : 20px;
margin-top : 0;
}
}
.c-article .c-article-head .c-article-head__category .c-article-label {
display : inline-block;
background-color : #25282a;
color : #ffffff;
font-size : 13px;
font-size : 1.3rem;
font-weight : 700;
padding : 0 0.8em;
line-height : 1.65;
}
.c-article .c-article-head .c-article-head__title {
font-size : 24px;
font-size : 2.4rem;
line-height : 1.6;
margin-top : 40px;
width : 100%;
}
.c-article .c-article-content {
font-size : 16px;
font-size : 1.6rem;
margin-bottom : 56px;
}
.c-article .c-article-content h2:not([class]) {
font-size : 22px;
font-size : 2.2rem;
font-weight : 700;
line-height : 1.6;
margin-bottom : 0.6em;
}
.c-article .c-article-content h2:not(:first-child) {
margin-top : 40px;
}
.c-article .c-article-content h3:not([class]) {
font-size : 20px;
font-size : 2rem;
font-weight : 700;
line-height : 1.6;
margin-bottom : 0.6em;
}
.c-article .c-article-content h3:not(:first-child) {
margin-top : 1.8em;
}
.c-article .c-article-content h4:not([class]) {
font-size : 18px;
font-size : 1.8rem;
font-weight : 700;
line-height : 1.6;
margin-bottom : 0.6em;
}
.c-article .c-article-content h4:not(:first-child) {
margin-top : 1.8em;
}
.c-article .c-article-content p:not([class]) {
line-height : 2;
margin-bottom : 2em;
}
.c-article .c-article-content .c-article-text-small {
font-size : 13px;
font-size : 1.3rem;
line-height : 2;
margin-bottom : 2em;
}
.c-article .c-article-content img:not([class]) {
margin-left : auto;
margin-right : auto;
display : block;
}
.c-article .c-article-content ul:not([class]) {
list-style : inside;
line-height : 2;
}
.c-article .c-article-content ul:not([class]) li {
text-indent : -1em;
padding-left : 1em;
}
.c-article .c-article-content .mt-be-columns {
gap : 32px;
}
.c-article .c-article-content > *:not([class]):last-child {
margin-bottom : 0;
}
/* text- helper
--------------------------------------------------------- */
.c-bg-full {
margin : 0 calc(50% - 50vw);
padding : 0 calc(50vw - 50%);
}
.c-bg-text {
padding : 6px;
background-color : #25282a;
font-weight : 700;
color : #ffffff;
background : linear-gradient(transparent 0%, #25282a 0%);
line-height : 1.8;
}
.c-bg-text .c-bg-text-margin-sm {
display : inline-block;
padding-left : 6px;
}
@media screen and (min-width: 768px) {
.c-bg-text .c-bg-text-margin-sm {
display : none;
}
}
@media screen and (min-width: 768px) {
.c-bg-text .c-bg-text-margin-md {
display : inline-block;
padding-left : 6px;
}
}
@media screen and (min-width: 1024px) {
.c-bg-text .c-bg-text-margin-lg {
display : inline-block;
padding-left : 6px;
}
}
.c-bg-warm-white {
background-color : rgba(242, 233, 219, 0.25);
}
/* button - component - object
--------------------------------------------------------- */
.c-button {
display : inline-block;
text-align : center;
vertical-align : middle;
border-radius : 100vh;
font-weight : bold;
padding : 0.75em 1.2em;
box-sizing : border-box;
position : relative;
transition : all 0.25s ease-out;
}
.c-button--default {
background-color : #25282a;
border : 1px solid #ffffff;
color : #ffffff;
}
.c-button--default:hover {
border : 1px solid #ffffff;
background-color : #ff6a14;
color : #ffffff;
}
.c-button--primary {
background-color : #ff6a14;
border : 1px solid #ff6a14;
color : #ffffff;
}
.c-button--primary:hover {
border : 1px solid #ffffff;
background-color : #25282a;
color : #ffffff;
}
.c-button--secondary {
border : 1px solid #ff6a14;
background-color : #ffffff;
color : #ff6a14;
}
.c-button--secondary:hover {
background-color : #ff6a14;
color : #ffffff;
}
.c-button--small {
min-width : 128px;
font-size : 14px;
font-size : 1.4rem;
}
.c-button--arrow:before {
content : "";
position : absolute;
top : 50%;
transform : translateY(-50%);
right : 18px;
background-image : url("data:image/svg+xml;utf8,");
background-repeat : no-repeat;
background-position : center;
background-size : contain;
width : 14px;
height : 10px;
transition : all 0.25s ease-out;
z-index : 1;
}
.c-button--arrow:hover:before {
right : 14px;
}
.c-button--external {
display : inline-flex;
align-items : center;
justify-content : center;
}
.c-button--external:after {
content : "";
background-image : url("data:image/svg+xml;utf8,");
background-repeat : no-repeat;
background-position : center;
background-size : contain;
width : 1em;
height : 1em;
display : inline-block;
transition : all 0.25s ease-out;
margin-left : 6px;
}
.c-button--external.c-button--secondary:after {
background-image : url("data:image/svg+xml;utf8,");
}
.c-button--external.c-button--secondary:hover:after {
background-image : url("data:image/svg+xml;utf8,");
}
.c-button-wrap {
position : relative;
display : inline-block;
}
.c-button-download-pdf {
font-size : 14px;
font-size : 1.4rem;
font-weight : 700;
border : 1px solid #707070;
display : inline-flex;
align-items : center;
padding : 1.28em 2.28em;
margin : 56px auto;
}
.c-button-download-pdf:before {
content : "";
flex : 0 0 auto;
background-image : url("../img/common/icon_pdf.svg");
background-repeat : no-repeat;
background-position : left top;
background-size : contain;
width : 42px;
height : 27px;
display : inline-block;
margin-right : 16px;
}
/* archive - component - object
--------------------------------------------------------- */
.c-card-list {
display : flex;
flex-wrap : wrap;
gap : 50px 30px;
}
.c-card-list .c-card-list__item {
width : 100%;
}
@media screen and (min-width: 768px) {
.c-card-list .c-card-list__item {
width : calc((100% - 60px) / 3);
}
}
.c-card .c-card__thumbnail {
margin-bottom : 20px;
box-sizing : border-box;
position : relative;
border-radius : 3px;
overflow : hidden;
}
.c-card .c-card__thumbnail a {
display : inline-block;
}
.c-card .c-card__thumbnail a:before {
content : "";
width : 100%;
height : 100%;
position : absolute;
left : 0;
top : 0;
border : 3px solid #ff6a14;
border-radius : 3px;
box-sizing : border-box;
opacity : 0;
transition : all 0.15s ease-out;
z-index : 2;
}
.c-card .c-card__thumbnail a:hover:before {
opacity : 1;
}
.c-card .c-card__thumbnail--border:after {
content : "";
width : 100%;
height : 100%;
position : absolute;
left : 0;
top : 0;
border : 1px solid #25282a;
border-radius : 3px;
box-sizing : border-box;
z-index : 1;
}
.c-card .c-card__title {
font-size : 20px;
font-size : 2rem;
line-height : 1.6;
color : #ff6a14;
font-weight : 700;
text-align : center;
margin-bottom : 10px;
}
.c-card .c-card__text {
font-size : 16px;
font-size : 1.6rem;
line-height : 2;
}
/* category - component - object
--------------------------------------------------------- */
@media screen and (max-width: 767px) {
.c-category-navi {
position : relative;
display : inline-block;
font-size : 16px;
font-size : 1.6rem;
}
.c-category-navi__button {
border : 1px solid #707070;
border-radius : 100vh;
background-color : #ffffff;
padding : 0.625em 3em 0.625em 1em;
text-align : left;
min-width : 225px;
display : inline-block;
position : relative;
cursor : pointer;
box-sizing : border-box;
transition : all 0.25s ease-out;
}
.c-category-navi__button:after {
content : "";
display : inline-block;
vertical-align : middle;
width : 0.5em;
height : 0.5em;
border : 1px solid #25282a;
border-left : 0;
border-bottom : 0;
box-sizing : border-box;
transform : translateY(-25%) rotate(135deg);
position : absolute;
top : calc(50% - 0.25em);
right : 1em;
}
.c-category-navi__button.is-open:after {
transform : translateY(25%) rotate(-45deg);
}
.c-category-navi__inner {
position : absolute;
width : 100%;
height : 100%;
left : 0;
top : 0;
display : none;
z-index : 100;
}
.c-category-navi__inner--show {
display : block;
}
.c-category-navi-list {
padding : 0;
margin : 0;
list-style : none;
background-color : #ffffff;
border-radius : 8px;
box-shadow : 0 8px 16px rgba(0, 0, 0, 0.32);
width : 100%;
position : absolute;
padding : 1em;
box-sizing : border-box;
}
.c-category-navi-list__item {
font-size : 16px;
font-size : 1.6rem;
padding : 6px 0;
cursor : pointer;
}
.c-category-navi-list__item:hover {
color : #ff6a14;
}
.c-category-navi-list__link.is-active {
color : #ff6a14;
}
}
@media screen and (min-width: 768px) {
.c-category-navi {
display : flex;
flex-wrap : wrap;
gap : 6px 8px;
font-size : 16px;
font-size : 1.6rem;
max-width : 540px;
}
.c-category-navi__button {
display : none;
}
.c-category-navi-list {
display : flex;
flex-wrap : wrap;
gap : 5px 8px;
}
.c-category-navi-list__link {
background-color : #ffffff;
color : rgba(37, 40, 42, 0.5);
display : inline-block;
text-align : center;
vertical-align : middle;
border-radius : 100vh;
font-weight : 700;
box-sizing : border-box;
position : relative;
padding : 0.5em 1em;
border : 1px solid #707070;
transition : all 0.25s ease-out;
}
.c-category-navi-list__link:hover {
background-color : #ff6a14;
color : #ffffff;
border : 1px solid #ff6a14;
}
.c-category-navi-list__link.is-active {
background-color : #ff6a14;
color : #ffffff;
border : 1px solid #ff6a14;
}
}
/* corner - component - object
--------------------------------------------------------- */
.c-corner-right {
width : 100%;
height : 100%;
position : absolute;
top : -30px;
right : 0;
-webkit-mask-image : url("../img/common/corner_right_top.svg");
-webkit-mask-repeat : no-repeat;
-webkit-mask-position : top right;
-webkit-mask-size : 100% auto;
mask-image : url("../img/common/corner_right_top.svg");
mask-repeat : no-repeat;
mask-position : top right;
mask-size : 100% auto;
background-color : rgba(242, 233, 219, 0.5);
z-index : -1;
}
@media screen and (min-width: 768px) {
.c-corner-right {
width : 62.81vw;
max-width : 858px;
top : 0;
}
}
@media screen and (min-width: 1920px) {
.c-corner-right {
width : 59.16vw;
max-width : 1136px;
}
}
.c-corner-right .c-corner-right__inner {
position : absolute;
right : 0;
top : 35.2vw;
background-color : #25282a;
width : 74.66vw;
height : 38.66vw;
overflow : hidden;
}
@media screen and (min-width: 768px) {
.c-corner-right .c-corner-right__inner {
top : 24.89vw;
width : 41.94vw;
height : 25.25vw;
max-width : 573px;
max-height : 345px;
}
}
@media screen and (min-width: 1024px) {
.c-corner-right .c-corner-right__inner {
top : 340px;
}
}
@media screen and (min-width: 1920px) {
.c-corner-right .c-corner-right__inner {
width : 44.68vw;
max-width : 858px;
}
}
.c-corner-right .c-corner-right__inner:before {
content : "";
width : 16.8vw;
height : 12.53vw;
display : block;
background-image : url("../img/common/corner_orange.svg");
background-repeat : no-repeat;
background-position : right bottom;
background-size : contain;
position : absolute;
right : 0;
bottom : 0;
z-index : 1;
}
@media screen and (min-width: 768px) {
.c-corner-right .c-corner-right__inner:before {
width : 10.54vw;
height : 7.83vw;
max-width : 144px;
max-height : 107px;
}
}
@media screen and (min-width: 1920px) {
.c-corner-right .c-corner-right__inner:before {
background-image : url("../img/common/corner_orange_lg.svg");
width : 21.97vw;
height : 17.96vw;
max-width : 422px;
max-height : 345px;
}
}
.c-corner-right--img .c-corner-right__inner {
background-color : transparent;
}
.c-corner-right--wh .c-corner-right__inner {
background-color : rgba(255, 255, 255, 0.5);
}
/* form - component - object
--------------------------------------------------------- */
input.c-input[type=text] , input.c-input[type=email] , input.c-input[type=tel] , input.c-input[type=number] {
font-size : 16px;
font-size : 1.6rem;
background-color : rgba(242, 233, 219, 0.5);
padding : 1em;
box-sizing : border-box;
}
textarea.c-textarea {
font-size : 16px;
font-size : 1.6rem;
background-color : rgba(242, 233, 219, 0.5);
padding : 1em;
box-sizing : border-box;
min-height : 12em;
}
.c-form {
display : flex;
flex-wrap : wrap;
gap : 48px 30px;
}
.c-form-field {
width : 100%;
}
@media screen and (min-width: 768px) {
.c-form-field--50 {
width : calc((100% - 30px) / 2);
}
}
.c-form-field__label {
font-weight : 700;
white-space : nowrap;
font-size : 16px;
font-size : 1.6rem;
margin-bottom : 18px;
display : flex;
flex-wrap : wrap;
align-items : center;
}
.c-form-field__text {
display : flex;
flex-wrap : wrap;
align-items : center;
}
.c-form-field__postal-code .c-input {
width : 10em;
}
.c-form-field__tel .c-input {
width : 16em;
}
.c-form-button {
display : inline-block;
border : 1px solid #25282a;
border-radius : 3px;
font-size : 13px;
font-size : 1.3rem;
text-align : center;
width : 100%;
max-width : 110px;
padding : 0.75em 1em;
box-sizing : border-box;
white-space : nowrap;
}
.c-label {
font-size : 13px;
font-size : 1.3rem;
font-weight : 700;
font-style : normal;
background-color : #25282a;
border-radius : 100vh;
color : #ffffff;
display : inline-block;
padding : 0.4em 0.7em;
margin-left : 16px;
}
.c-form-field__select {
position : relative;
min-width : 100%;
}
@media screen and (min-width: 768px) {
.c-form-field__select {
min-width : auto;
}
}
.c-form-field__select-label {
width : 100%;
display : inline-block;
font-size : 16px;
font-size : 1.6rem;
background-color : rgba(242, 233, 219, 0.5);
padding : 1em 2.5em 1em 1em;
box-sizing : border-box;
position : relative;
overflow : hidden;
z-index : 1;
}
.c-form-field__select-label:after {
content : "";
display : inline-block;
vertical-align : middle;
width : 1rem;
height : 1rem;
border : 1px solid #25282a;
border-left : 0;
border-bottom : 0;
box-sizing : border-box;
transform : translateY(-50%) rotate(135deg);
position : absolute;
top : 50%;
right : 16px;
}
input[type=radio] , input[type=checkbox] {
margin : 0;
padding : 0;
background : none;
border : none;
border-radius : 0;
outline : none;
appearance : none;
}
input[type=checkbox] {
position : relative;
display : inline-block;
width : 2em;
height : 2em;
box-sizing : border-box;
transition : all 0.25s ease-out;
border : 1px solid rgba(37, 40, 42, 0.5);
background-color : rgba(242, 233, 219, 0.5);
}
input[type=checkbox]:after {
content : "";
display : inline-block;
position : absolute;
left : 50%;
top : 50%;
transform : translateX(-50%) translateY(-50%) rotate(45deg);
width : 0.35em;
height : 0.6em;
border : solid #ffffff;
border-width : 0 2px 2px 0;
opacity : 0;
}
input[type=checkbox]:checked {
background : #ff6a14;
border : 1px solid #ff6a14;
}
input[type=checkbox]:checked:after {
opacity : 1;
}
input[type=radio] {
position : relative;
top : -0.1em;
box-sizing : border-box;
width : 1em;
height : 1em;
background-color : #ffffff;
border : 1px solid #25282a;
border-radius : 50%;
cursor : pointer;
transition : all 0.25s ease-out;
display : inline-block;
background-color : rgba(242, 233, 219, 0.5);
}
input[type=radio]:after {
content : "";
display : inline-block;
position : absolute;
top : 50%;
left : 50%;
transform : translate(-50%, -50%);
width : 0.3em;
height : 0.3em;
background-color : #ffffff;
border-radius : 50%;
opacity : 0;
}
input[type=radio]:checked {
background : #ff6a14;
border : 1px solid #ff6a14;
}
input[type=radio]:checked:after {
opacity : 1;
}
.c-input-radio-group {
display : flex;
flex-wrap : wrap;
}
.c-input-radio-group .c-input-radio-group__item {
display : inline-block;
margin-left : 50px;
}
.c-input-radio-group .c-input-radio-group__item:first-child {
margin-left : 0;
}
.c-input-radio__label {
margin-left : 12px;
display : inline-block;
}
.c-form-accept__title {
font-size : 16px;
font-size : 1.6rem;
font-weight : 700;
line-height : 2;
margin-bottom : 16px;
}
.c-form-accept__text {
font-size : 16px;
font-size : 1.6rem;
line-height : 2;
margin-bottom : 32px;
}
.c-form-accept__details {
width : 100%;
max-height : 192px;
background-color : #ffffff;
overflow-y : scroll;
border : 1px solid #25282a;
box-sizing : border-box;
padding : 1em;
margin-bottom : 35px;
}
.c-form-accept__details--privacy-policy h3:not([class]) {
font-size : 16px;
font-size : 1.6rem;
font-weight : 700;
line-height : 2;
margin-bottom : 10px;
margin-top : 0;
}
.c-form-accept__details--privacy-policy p:not([class]) {
font-size : 16px;
font-size : 1.6rem;
line-height : 2;
margin-bottom : 1em;
}
.c-form-accept__details--privacy-policy ol:not([class]) {
counter-reset : accept-details-counter;
}
.c-form-accept__details--privacy-policy ol:not([class]) > li {
margin-bottom : 1em;
}
.c-form-accept__details--privacy-policy ol:not([class]) > li > dl {
font-size : 13px;
font-size : 1.3rem;
line-height : 2;
}
.c-form-accept__details--privacy-policy ol:not([class]) > li > dl dt {
font-weight : 700;
}
.c-form-accept__details--privacy-policy ol:not([class]) > li > dl dt:before {
content : counter(accept-details-counter) ".";
counter-increment : accept-details-counter;
display : inline-block;
}
.c-form-accept__checkbox {
display : flex;
justify-content : center;
align-items : center;
}
.c-form-accept__checkbox span {
display : inline-block;
margin-left : 24px;
}
.c-form-accept__checkbox p:not([class]) {
margin-bottom : 0;
margin-left : 24px;
}
.c-form-input-button {
width : 100%;
text-align : center;
}
.c-form-input-button .c-button {
min-width : 156px;
}
.c-form-iframe {
border : 1px solid #25282a;
}
/* archive - component - object
--------------------------------------------------------- */
.c-list-indent li {
padding-left : 1em;
text-indent : -1em;
line-height : 2;
}
.c-list-dot li {
padding-left : 1em;
text-indent : -1em;
line-height : 2;
}
.c-list-dot li:before {
content : "・";
display : inline;
margin : 0 0.25em;
}
.c-list-decimal {
counter-reset : decimal-counter;
}
.c-list-decimal li {
padding-left : 2em;
text-indent : -2em;
line-height : 2;
margin-bottom : 30px;
}
.c-list-decimal li:before {
content : counter(decimal-counter) ".";
counter-increment : decimal-counter;
display : inline;
font-family : "UniNeueBold";
margin-right : 1em;
}
.c-list-decimal li:last-child {
margin-bottom : 0;
}
.c-list-circle-decimal {
counter-reset : circle-decimal-counter;
}
.c-list-circle-decimal li {
display : flex;
margin-bottom : 30px;
}
.c-list-circle-decimal li:before {
content : counter(circle-decimal-counter);
counter-increment : circle-decimal-counter;
display : inline-block;
font-family : "UniNeueBold";
border : 3px solid #ff6a14;
color : #ff6a14;
width : 48px;
height : 48px;
text-align : center;
font-size : 24px;
font-size : 2.4rem;
border-radius : 50%;
line-height : 42px;
flex : 0 0 auto;
margin-right : 16px;
box-sizing : border-box;
}
.c-list-circle-decimal li dt {
font-size : 20px;
font-size : 2rem;
line-height : 1.5;
font-weight : 700;
margin-bottom : 8px;
}
.c-list-circle-decimal li dd {
font-size : 16px;
font-size : 1.6rem;
line-height : 1.5;
}
.c-list-circle-decimal li .c-list-circle-decimal__img {
margin-top : 24px;
}
.c-list-circle-decimal li:last-child {
margin-bottom : 0;
}
/* navi - component - object
--------------------------------------------------------- */
/* corner - component - object
--------------------------------------------------------- */
.c-page-mainvisual {
position : absolute;
top : 0;
right : 0;
-webkit-mask-image : url("../img/common/main-visual_mask_sm.svg");
mask-image : url("../img/common/main-visual_mask_sm.svg");
-webkit-mask-repeat : no-repeat;
mask-repeat : no-repeat;
-webkit-mask-position : top right;
mask-position : top right;
-webkit-mask-size : 100% auto;
mask-size : 100% auto;
overflow : hidden;
z-index : -1;
}
@media screen and (min-width: 768px) {
.c-page-mainvisual {
width : 62.81vw;
height : 35.13vw;
}
}
@media screen and (min-width: 1024px) {
.c-page-mainvisual {
-webkit-mask-image : url("../img/common/main-visual_mask_md.svg");
mask-image : url("../img/common/main-visual_mask_md.svg");
width : 858px;
height : 480px;
}
}
@media screen and (min-width: 1920px) {
.c-page-mainvisual {
-webkit-mask-image : url("../img/common/main-visual_mask_lg.svg");
mask-image : url("../img/common/main-visual_mask_lg.svg");
width : 1130px;
}
}
.c-page-mainvisual img {
object-fit : cover;
object-position : 0 0;
width : 100%;
height : 100%;
}
.c-page-head {
padding-top : 72.53vw;
margin-bottom : 12.8vw;
}
@media screen and (min-width: 768px) {
.c-page-head {
padding-top : 24.15vw;
margin-bottom : 100px;
}
}
@media screen and (min-width: 1024px) {
.c-page-head {
padding-top : 0;
}
}
.c-page-head .c-page-title {
margin-bottom : 19.2vw;
}
@media screen and (min-width: 768px) {
.c-page-head .c-page-title {
margin-bottom : 80px;
}
}
.c-page-head .c-page-title .c-page-title__sub {
margin-bottom : 10px;
color : #ff6a14;
font-size : 18px;
font-size : 1.8rem;
}
.c-page-head .c-page-lead {
width : 100%;
}
@media screen and (min-width: 1024px) {
.c-page-head .c-page-lead {
max-width : 540px;
}
}
.c-page-head .c-page-lead .c-page-lead__main {
font-size : 20px;
font-size : 2rem;
margin-bottom : 32px;
line-height : 1.6;
}
.c-page-head .c-page-lead .c-page-lead__text {
font-size : 16px;
font-size : 1.6rem;
line-height : 2;
margin-bottom : 1em;
font-weight : 700;
}
.c-page-head .c-page-lead .c-page-lead__text:last-child {
margin-bottom : 0;
}
.c-page-head .c-page-lead .c-page-lead__button {
margin-top : 32px;
}
.c-page-head .c-page-lead .c-page-lead__button .c-button {
font-size : 14px;
font-size : 1.4rem;
min-width : 274px;
}
.c-page-head--2-level {
padding-top : 72vw;
margin-bottom : 19.2vw;
}
@media screen and (min-width: 768px) {
.c-page-head--2-level {
padding-top : 24.15vw;
margin-bottom : 100px;
}
}
@media screen and (min-width: 1024px) {
.c-page-head--2-level {
padding-top : 0;
min-height : 360px;
}
}
@media screen and (min-width: 1024px) {
.c-page-head--3-level {
min-height : 450px;
}
}
.c-page-navi {
padding : 0 15px;
margin : 0 -15px;
overflow-x : auto;
border-bottom : 1px solid rgba(37, 40, 42, 0.2);
scrollbar-width : none;
}
@media screen and (min-width: 1024px) {
.c-page-navi {
padding : 0;
margin : 0 auto 24px;
border-bottom : 0;
}
}
.c-page-navi::-webkit-scrollbar {
display : none;
}
.c-page-navi .c-page-navi-list {
display : flex;
}
@media screen and (min-width: 1024px) {
.c-page-navi .c-page-navi-list {
width : 100%;
width : 730px;
margin-left : auto;
margin-right : auto;
}
}
.c-page-navi .c-page-navi-list .c-page-navi-list__item {
flex : 0 0 auto;
font-size : 14px;
font-size : 1.4rem;
line-height : 1.6;
font-weight : 700;
text-align : center;
color : rgba(37, 40, 42, 0.5);
}
@media screen and (min-width: 1024px) {
.c-page-navi .c-page-navi-list .c-page-navi-list__item {
width : 25%;
border-right : 1px solid #25282a;
box-sizing : border-box;
color : #25282a;
}
.c-page-navi .c-page-navi-list .c-page-navi-list__item:first-child {
border-left : 1px solid #25282a;
}
}
.c-page-navi .c-page-navi-list .c-page-navi-list__item.is-active {
border-bottom : 1px solid #25282a;
color : #25282a;
}
@media screen and (min-width: 1024px) {
.c-page-navi .c-page-navi-list .c-page-navi-list__item.is-active {
border-bottom : 0;
color : #ff6a14;
}
}
.c-page-navi .c-page-navi-list .c-page-navi-list__link {
width : 100%;
height : 100%;
display : flex;
justify-content : center;
align-items : center;
padding : 10px 12px;
box-sizing : border-box;
}
@media screen and (min-width: 1024px) {
.c-page-navi .c-page-navi-list .c-page-navi-list__link:hover {
color : #ff6a14;
}
}
.c-page-navi.is-fixed {
width : 100%;
box-sizing : border-box;
position : fixed;
top : 60px;
left : 0;
z-index : 500;
margin : 0;
background-color : rgba(255, 255, 255, 0.9);
}
@media screen and (min-width: 1024px) {
.c-page-navi.is-fixed {
width : auto;
top : 78px;
left : 50%;
transform : translateX(-50%);
}
}
/* pagenation - component - object
--------------------------------------------------------- */
.c-pagenation {
position : relative;
display : flex;
flex-wrap : wrap;
justify-content : center;
}
.c-pagenation .c-pagination__item {
text-decoration : underline;
}
.c-pagenation .c-pagination__item:hover {
text-decoration : none;
}
.c-pagenation .c-pagination__item--current {
text-decoration : none;
}
.c-pagenation .c-pagination__item--previous:before , .c-pagenation .c-pagination__item--next:before {
content : "";
display : inline-block;
vertical-align : middle;
width : 0.5em;
height : 0.5em;
border : 1px solid #25282a;
border-left : 0;
border-bottom : 0;
text-decoration : underline;
transition : all 0.15s ease-out;
}
.c-pagenation .c-pagination__item--previous:hover:before , .c-pagenation .c-pagination__item--next:hover:before {
text-decoration : none;
}
.c-pagenation .c-pagination__item--first , .c-pagenation .c-pagination__item--last {
position : relative;
}
.c-pagenation .c-pagination__item--first:before , .c-pagenation .c-pagination__item--last:before {
content : "";
display : inline-block;
vertical-align : middle;
width : 0.5em;
height : 0.5em;
border : 1px solid #25282a;
border-left : 0;
border-bottom : 0;
text-decoration : underline;
transition : all 0.15s ease-out;
}
.c-pagenation .c-pagination__item--first:after , .c-pagenation .c-pagination__item--last:after {
content : "";
display : inline-block;
vertical-align : middle;
width : 0.5em;
height : 0.5em;
border : 1px solid #25282a;
border-left : 0;
border-bottom : 0;
text-decoration : underline;
transition : all 0.15s ease-out;
}
.c-pagenation .c-pagination__item--previous:before {
transform : translateX(25%) rotate(-135deg);
}
.c-pagenation .c-pagination__item--next:before {
transform : translateX(-25%) rotate(45deg);
}
.c-pagenation .c-pagination__item--first:before {
transform : translateX(25%) rotate(-135deg);
}
.c-pagenation .c-pagination__item--first:after {
transform : translateX(25%) rotate(-135deg);
}
.c-pagenation .c-pagination__item--last:before {
transform : translateX(-25%) rotate(45deg);
}
.c-pagenation .c-pagination__item--last:after {
transform : translateX(-25%) rotate(45deg);
}
.c-pagenation-line {
text-align : center;
}
.c-pagenation-line .c-pagenation-line__inner {
position : relative;
display : inline-flex;
flex-wrap : wrap;
justify-content : center;
border-bottom : 1px solid rgba(37, 40, 42, 0.3);
}
.c-pagenation-line .c-pagenation-line__item {
color : rgba(37, 40, 42, 0.3);
font-family : "UniNeueBold";
font-size : 13px;
font-size : 1.3rem;
width : 32px;
height : 32px;
text-align : center;
line-height : 32px;
}
.c-pagenation-line .c-pagenation-line__item:hover {
color : #25282a;
}
.c-pagenation-line .c-pagenation-line__item--current {
color : #25282a;
border-bottom : 1px solid #25282a;
}
.c-pagenation-line .c-pagenation-line__item--previous:before , .c-pagenation-line .c-pagenation-line__item--next:before {
content : "";
display : inline-block;
vertical-align : middle;
width : 0.5em;
height : 0.5em;
border : 1px solid rgba(37, 40, 42, 0.3);
border-left : 0;
border-bottom : 0;
box-sizing : border-box;
transition : all 0.15s ease-out;
}
.c-pagenation-line .c-pagenation-line__item--previous:hover:before , .c-pagenation-line .c-pagenation-line__item--next:hover:before {
border-color : #25282a;
}
.c-pagenation-line .c-pagenation-line__item--first , .c-pagenation-line .c-pagenation-line__item--last {
position : relative;
}
.c-pagenation-line .c-pagenation-line__item--first:before , .c-pagenation-line .c-pagenation-line__item--last:before {
content : "";
display : inline-block;
vertical-align : middle;
width : 0.5em;
height : 0.5em;
border : 1px solid rgba(37, 40, 42, 0.3);
border-left : 0;
border-bottom : 0;
text-decoration : underline;
transition : all 0.15s ease-out;
}
.c-pagenation-line .c-pagenation-line__item--first:after , .c-pagenation-line .c-pagenation-line__item--last:after {
content : "";
display : inline-block;
vertical-align : middle;
width : 0.5em;
height : 0.5em;
border : 1px solid rgba(37, 40, 42, 0.3);
border-left : 0;
border-bottom : 0;
text-decoration : underline;
transition : all 0.15s ease-out;
}
.c-pagenation-line .c-pagenation-line__item--first:hover:before , .c-pagenation-line .c-pagenation-line__item--first:hover:after , .c-pagenation-line .c-pagenation-line__item--last:hover:before , .c-pagenation-line .c-pagenation-line__item--last:hover:after {
border-color : #25282a;
}
.c-pagenation-line .c-pagenation-line__item--previous:before {
transform : translateX(25%) rotate(-135deg);
}
.c-pagenation-line .c-pagenation-line__item--next:before {
transform : translateX(-25%) rotate(45deg);
}
.c-pagenation-line .c-pagenation-line__item--first:before {
transform : translateX(25%) rotate(-135deg);
}
.c-pagenation-line .c-pagenation-line__item--first:after {
transform : translateX(25%) rotate(-135deg);
}
.c-pagenation-line .c-pagenation-line__item--last:before {
transform : translateX(-25%) rotate(45deg);
}
.c-pagenation-line .c-pagenation-line__item--last:after {
transform : translateX(-25%) rotate(45deg);
}
.c-pagenation-archive {
font-size : 14px;
font-size : 1.4rem;
font-weight : 700;
column-gap : 1em;
}
.c-pagenation-single {
font-size : 16px;
font-size : 1.6rem;
gap : 32px 40px;
}
@media screen and (min-width: 768px) {
.c-pagenation-single .c-pagenation__previous , .c-pagenation-single .c-pagenation__next {
position : absolute;
}
}
@media screen and (min-width: 768px) {
.c-pagenation-single .c-pagenation__previous {
left : 0;
top : 0;
}
}
@media screen and (min-width: 768px) {
.c-pagenation-single .c-pagenation__next {
right : 0;
top : 0;
}
}
.c-pagenation-single .c-pagenation__all {
margin-left : auto;
margin-right : auto;
width : 100%;
text-align : center;
}
/* section - component - object
--------------------------------------------------------- */
.c-section-container {
position : relative;
padding-top : 48px;
padding-bottom : 48px;
}
@media screen and (min-width: 1024px) {
.c-section-container {
padding-top : 100px;
padding-bottom : 100px;
}
}
.c-section-container h3:not([class]) {
font-size : 16px;
font-size : 1.6rem;
font-weight : 700;
line-height : 1.6;
margin-top : 2.5em;
margin-bottom : 0.5em;
}
.c-section-container p:not([class]) {
font-size : 16px;
font-size : 1.6rem;
line-height : 2;
margin-bottom : 2.5em;
}
.c-section-container:last-of-type {
margin-bottom : 72px;
}
@media screen and (min-width: 1024px) {
.c-section-container:last-of-type {
margin-bottom : 20px;
}
}
.c-section-container.c-bg-full:last-of-type {
padding-bottom : 120px;
margin-bottom : 0;
}
.c-section-container .l-inner > *:last-child {
margin-bottom : 0;
}
.c-section-text {
font-size : 16px;
font-size : 1.6rem;
line-height : 2;
margin-bottom : 2em;
}
.c-section-img {
max-width : 540px;
height : auto;
margin : 45px auto;
}
.c-section-img img + img {
margin-top : 30px;
}
.c-section-recommend .c-section-recommend__text {
line-height : 1.6;
margin-bottom : 16px;
}
.c-section-recommend .c-section-recommend__list li {
margin-bottom : 13px;
}
.c-section-recommend .c-section-recommend__list li:last-child {
margin-bottom : 0;
}
.c-section-recommend .c-button {
min-width : 274px;
font-size : 14px;
font-size : 1.4rem;
}
.c-section-guide .c-button {
min-width : 274px;
font-size : 14px;
font-size : 1.4rem;
}
.c-section-sub {
margin-bottom : 70px;
}
.c-section-sub-title {
font-size : 16px;
font-size : 1.6rem;
line-height : 2;
margin-bottom : 14px;
}
/* sns - component - object
--------------------------------------------------------- */
.c-sns-list {
display : flex;
gap : 8px;
}
@media screen and (min-width: 768px) {
.c-sns-list {
gap : 16px;
}
}
.c-sns-list .c-sns-list__item {
position : relative;
flex : 1 1 auto;
display : block;
width : 100%;
max-width : 95px;
height : 40px;
border-radius : 6px;
}
.c-sns-list .c-sns-list__link {
width : 100%;
height : 100%;
border-radius : 4px;
display : flex;
justify-content : center;
align-items : center;
cursor : pointer;
}
.c-sns-list .c-sns-list__link--twitter {
background-color : #1da1f2;
}
.c-sns-list .c-sns-list__link--facebook {
background-color : #1877f2;
}
.c-sns-list .c-sns-list__link--line {
background-color : #06c755;
}
.c-sns-list .c-sns-list__link--url {
background-color : #888888;
}
.url-copied {
display : none;
}
.url-copied span {
width : 100%;
height : 100%;
background : rgba(37, 40, 42, 0.5);
display : flex;
align-items : center;
justify-content : center;
text-align : center;
position : absolute;
top : 0;
left : 0;
font-size : 12px;
color : #ffffff;
border-radius : 4px;
}
/* title - component - object
--------------------------------------------------------- */
.c-title-section-wrapper {
text-align : center;
}
@media screen and (min-width: 768px) {
.c-title-section-wrapper {
text-align : left;
}
}
.c-title-section-wrapper .c-title-section {
text-align : center;
}
@media screen and (min-width: 768px) {
.c-title-section-wrapper .c-title-section {
text-align : left;
}
}
.c-title-section {
position : relative;
font-size : 24px;
font-size : 2.4rem;
font-weight : 700;
color : #ff6a14;
text-align : center;
display : inline-block;
margin-bottom : 1.55em;
line-height : 1.4;
}
@media screen and (min-width: 768px) {
.c-title-section {
text-align : left;
}
}
@media screen and (min-width: 1024px) {
.c-title-section {
display : block;
}
}
.c-title-section:before {
content : "";
width : 100%;
height : 1px;
background-color : #ff6a14;
display : inline-block;
position : absolute;
left : 0;
bottom : -12px;
}
@media screen and (min-width: 1024px) {
.c-title-section:before {
margin : 0 calc(50% - 50vw);
padding : 0 calc(50vw - 50%);
left : calc(50% - 50vw - 760px);
top : 50%;
bottom : auto;
}
}
.c-title-1-level {
font-size : 24px;
font-size : 2.4rem;
line-height : 1.4;
margin-bottom : 1.2em;
font-weight : 700;
}
.c-title-2-level {
font-size : 22px;
font-size : 2.2rem;
line-height : 1.4;
margin-bottom : 1.2em;
font-weight : 700;
}
.c-title-3-level {
font-size : 20px;
font-size : 2rem;
line-height : 1.4;
margin-bottom : 1.2em;
font-weight : 700;
}
.c-section-text + .c-title-2level {
margin-top : 3em;
}
.c-title-4-level {
font-size : 18px;
font-size : 1.8rem;
line-height : 1.4;
margin-top : 2.2em;
margin-bottom : 1em;
font-weight : 700;
}
.c-title-5-level {
font-size : 16px;
font-size : 1.6rem;
line-height : 1.4;
margin-top : 2.2em;
margin-bottom : 1em;
font-weight : 700;
}
.c-title-recovery {
margin-top : 2.5em;
}
/* youtube - component - object
--------------------------------------------------------- */
@media screen and (min-width: 1024px) {
.c-youtube {
max-width : calc(100% - 64px);
}
}
.c-youtube iframe {
width: 100%;
height: auto;
aspect-ratio: 16 / 9;
max-width: 600px;
display: block;
margin: auto;
z-index : 200;
position: relative;
padding-bottom : 40px;
}
/* company - project - object
--------------------------------------------------------- */
.p-company-list {
margin-bottom : 12rem;
}
.p-message-page-head .c-page-lead .c-page-lead__main {
font-size : 28px;
font-size : 2.8rem;
font-weight : 700;
line-height : 1.6;
}
.p-message-page-head .c-page-lead .c-page-lead__sub {
font-size : 22px;
font-size : 2.2rem;
line-height : 1.4;
margin-bottom : 1em;
font-weight : 700;
}
.p-message-page-head .c-page-img {
width : 74.66vw;
height : auto;
margin-left : auto;
margin-right : auto;
margin-bottom : 32px;
}
@media screen and (min-width: 768px) {
.p-message-page-head .c-page-img {
width : 445px;
}
}
@media screen and (min-width: 1024px) {
.p-message-page-head .c-page-img {
float : right;
max-width : 445px;
width : 32.57vw;
margin-left : 24px;
padding-top : 103px;
padding-right : 136px;
margin-bottom : 32px;
margin-right : calc(50% - 50vw);
}
}
@media screen and (min-width: 1920px) {
.p-message-page-head .c-page-img {
padding-right : 415px;
}
}
.p-brand-message {
display : flex;
flex-wrap : wrap;
justify-content : center;
gap : 30px;
margin-top : 80px;
}
.p-brand-message .p-brand-message__item {
flex : 0 0 auto;
display : flex;
flex-direction : column;
align-items : center;
text-align : center;
border-radius : 50%;
border : 3px solid #ff6a14;
box-sizing : border-box;
width : 350px;
height : 350px;
padding : 32px;
}
.p-brand-message .p-brand-message__title {
font-size : 28px;
font-size : 2.8rem;
color : #ff6a14;
font-weight : 700;
line-height : 1.4;
margin-bottom : 22px;
margin-top : 42px;
}
.p-brand-message .p-brand-message__text {
font-size : 20px;
font-size : 2rem;
font-weight : 700;
line-height : 1.8;
}
.p-brand-venex-logo {
margin-top : 80px;
margin-bottom : 64px;
}
@media screen and (min-width: 768px) {
.p-brand-venex-logo svg {
width : 500px;
}
}
@media screen and (min-width: 1024px) {
.p-brand-keyword-list {
margin-left : -15px;
margin-right : -15px;
}
}
.p-brand-keyword-list .p-brand-keyword-list__item {
display : flex;
align-items : center;
margin-bottom : 30px;
}
.p-brand-keyword-list .p-brand-keyword-list__item:last-child {
margin-bottom : 0;
}
@media screen and (min-width: 768px) {
.p-brand-keyword-list .p-brand-keyword-list__item:nth-of-type(3n+2) {
padding-left : 100px;
}
.p-brand-keyword-list .p-brand-keyword-list__item:nth-of-type(3n) {
padding-left : 200px;
}
}
.p-brand-keyword-list .p-brand-keyword-list__icon {
flex : 0 0 auto;
background-color : #25282a;
color : #ffffff;
width : 90px;
height : 90px;
border-radius : 50%;
font-size : 13px;
font-size : 1.3rem;
font-family : "UniNeueBold";
margin-right : 20px;
display : flex;
justify-content : center;
align-items : center;
line-height : 1.2;
text-align : center;
}
.p-brand-keyword-list .p-brand-keyword-list__title {
font-size : 20px;
font-size : 2rem;
color : #ff6a14;
font-weight : 700;
line-height : 1.4;
margin-bottom : 10px;
}
.p-brand-keyword-list .p-brand-keyword-list__text {
font-size : 16px;
font-size : 1.6rem;
line-height : 1.4;
}
.p-history-page-head {
min-height : auto;
margin-bottom : 0;
}
.p-history .p-history-title {
font-size : 16px;
font-size : 1.6rem;
font-weight : 700;
position : relative;
padding-left : 40px;
margin-bottom : 24px;
}
.p-history .p-history-title:before {
content : "";
width : 25px;
height : 1px;
background-color : #25282a;
display : inline-block;
position : absolute;
top : 50%;
left : 0;
transform : translateY(-50%);
}
.p-history .p-history-table {
table-layout : auto;
line-height : 1.8;
margin-bottom : 60px;
}
.p-history .p-history-table th {
width : 1em;
white-space : nowrap;
text-align : right;
font-weight : normal;
padding-left : 64px;
padding-right : 24px;
}
.p-history .p-history-table td {
padding-bottom : 4px;
}
.p-history .p-history-table tr:last-child td {
padding-bottom : 0;
}
.p-history .p-history-table:last-of-type {
margin-bottom : 0;
}
/* HISTORY:テーブル内リンクだけ下線をホバーで出す */
.p-history .p-history-table td a{
text-decoration-line: underline;
text-decoration-thickness: 1px;
text-underline-offset: 2px;
text-decoration-color: transparent;
transition: text-decoration-color .15s ease-out;
}
.p-history .p-history-table td a:hover,
.p-history .p-history-table td a:focus-visible{
text-decoration-color: currentColor;
}
.p-profile-corner-right .c-corner-right__inner img {
position : absolute;
left : 15px;
}
@media screen and (min-width: 768px) {
.p-profile-corner-right .c-corner-right__inner img {
position : static;
left : auto;
}
}
.p-profile {
padding-top : 64px;
}
.p-profile-table {
table-layout : auto;
}
.p-profile-table th , .p-profile-table td {
font-size : 16px;
font-size : 1.6rem;
line-height : 2;
text-align : left;
width : 100%;
display : block;
padding-bottom : 16px;
}
@media screen and (min-width: 768px) {
.p-profile-table th , .p-profile-table td {
padding-bottom : 45px;
display : table-cell;
}
}
.p-profile-table th {
white-space : nowrap;
font-weight : 700;
}
@media screen and (min-width: 768px) {
.p-profile-table th {
width : 1em;
padding-right : 56px;
}
}
.p-profile-table td {
padding-bottom : 45px;
}
@media screen and (min-width: 768px) {
.p-profile-table td {
width : auto;
}
}
@media screen and (min-width: 768px) {
.p-profile-table tr:last-of-type th {
padding-bottom : 0;
}
}
.p-profile-table tr:last-of-type td {
padding-bottom : 0;
}
.p-profile-map {
height : 0;
overflow : hidden;
padding-bottom : 400px;
position : relative;
}
.p-profile-map iframe {
position : absolute;
left : 0;
top : 0;
width : 100%;
height : 100%;
}
.p-overseasbase-world-map {
max-width : 730px;
margin-top : 90px;
}
.p-overseasbase-3-level {
font-size : 16px;
font-size : 1.6rem;
font-weight : bold;
position : relative;
padding-left : 40px;
margin-bottom : 40px;
margin-top : 72px;
}
.p-overseasbase-3-level:before {
content : "";
width : 25px;
height : 1px;
background-color : #25282a;
display : inline-block;
position : absolute;
top : 50%;
left : 0;
transform : translateY(-50%);
}
.p-overseasbase-3-level:first-of-type {
margin-top : 0;
}
.p-overseasbase-table {
table-layout : auto;
text-align : left;
margin-bottom : 24px;
}
.p-overseasbase-table th , .p-overseasbase-table td {
width : 100%;
display : block;
font-size : 16px;
font-size : 1.6rem;
line-height : 2;
word-break : break-word;
}
@media screen and (min-width: 768px) {
.p-overseasbase-table th , .p-overseasbase-table td {
display : table-cell;
}
}
.p-overseasbase-table th {
white-space : nowrap;
font-weight : 700;
}
@media screen and (min-width: 768px) {
.p-overseasbase-table th {
width : 1em;
padding-right : 35px;
}
}
.p-overseasbase-table td {
padding-bottom : 24px;
}
@media screen and (min-width: 768px) {
.p-overseasbase-table td {
width : auto;
padding-bottom : 0;
}
}
.p-overseasbase-table tr:last-child td {
padding-bottom : 0;
}
.p-overseasbase-item {
margin-bottom : 36px;
padding-left : 40px;
}
.p-overseasbase-item .p-overseasbase-item__text {
font-size : 16px;
font-size : 1.6rem;
line-height : 1.6;
}
/* contact - project - object
--------------------------------------------------------- */
.p-contact-page-head {
min-height : auto;
}
@media screen and (min-width: 1024px) {
.p-contact-page-head {
margin-bottom : 175px;
}
}
.p-contact-form {
margin-bottom : 12rem;
}
.p-contact-completion-page-head {
min-height : auto;
margin-bottom : 30px;
}
@media screen and (min-width: 768px) {
.p-contact-completion {
max-width : 500px;
margin-left : auto;
margin-right : auto;
}
}
.p-contact-completion-business-hours {
text-align : center;
border : 1px solid #25282a;
box-sizing : border-box;
padding : 32px;
margin-bottom : 30px;
}
.p-contact-completion-business-hours p {
line-height : 1.6;
}
.p-contact-completion-business-hours__title {
font-size : 13px;
font-size : 1.3rem;
font-weight : 700;
margin-bottom : 16px;
}
.p-contact-completion-business-hours__time {
font-size : 20px;
font-size : 2rem;
font-weight : 700;
color : #ff6a14;
margin-bottom : 16px;
}
.p-contact-completion__text {
font-size : 13px;
font-size : 1.3rem;
line-height : 2;
margin-bottom : 40px;
}
.p-contact-completion__tel {
text-align : center;
font-size : 24px;
font-size : 2.4rem;
margin-bottom : 54px;
}
.p-contact-completion__tel a {
text-decoration : none;
}
/* faq - project - object
--------------------------------------------------------- */
.p-faq-list .p-faq-list__item {
border-top : 1px solid #25282a;
}
.p-faq-list .p-faq-list__item:last-of-type {
border-bottom : 1px solid #25282a;
}
.p-faq-list .p-faq-list__question {
position : relative;
font-size : 16px;
font-size : 1.6rem;
line-height : 2;
font-weight : 700;
padding : 15px 80px 15px 40px;
}
.p-faq-list .p-faq-list__question:before {
content : "Q.";
font-family : "UniNeueBold";
font-size : 24px;
font-size : 2.4rem;
color : #ff6a14;
font-weight : normal;
display : inline-block;
position : absolute;
left : 0;
top : 0.25em;
}
.p-faq-list .p-faq-list__question i {
width : 20px;
height : 1px;
background-color : #25282a;
position : absolute;
top : 50%;
right : 10px;
transform : translate(-50%, -50%);
}
.p-faq-list .p-faq-list__question i:before {
content : "";
display : block;
width : 20px;
height : 1px;
background-color : #25282a;
transform : rotate(90deg);
}
.p-faq-list .p-faq-list__question.is-accordion-open i:before {
display : none;
}
.p-faq-list .p-faq-list__answer {
position : relative;
font-size : 16px;
font-size : 1.6rem;
line-height : 2;
padding : 15px 0 50px 40px;
}
@media screen and (min-width: 768px) {
.p-faq-list .p-faq-list__answer {
padding : 15px 80px 50px 40px;
}
}
.p-faq-list .p-faq-list__answer:before {
content : "A.";
font-family : "UniNeueBold";
font-size : 24px;
font-size : 2.4rem;
font-weight : normal;
display : inline-block;
position : absolute;
left : 0;
top : 0.25em;
}
.p-faq-list .p-faq-list__answer p {
margin-bottom : 1em;
}
/* home - project - object
--------------------------------------------------------- */
.p-home-main {
margin-bottom : 12rem;
}
/* --- keyvisual --- */
.p-home-keyvisual {
width : 100%;
position : relative;
}
@media screen and (min-width: 1024px) {
.p-home-keyvisual {
min-width : 1366px;
}
}
.p-home-news {
width : 100%;
position : relative;
}
@media screen and (min-width: 1024px) {
.p-home-news {
min-width : 1366px;
}
}
.p-home-news:before {
content : "";
display : block;
width : 100%;
height : 12rem;
background-image : url("data:image/svg+xml;utf8,");
background-repeat : no-repeat;
background-position : right top;
background-size : contain;
position : absolute;
right : 0;
top : -12rem;
}
.p-home-news .p-home-news__wrap {
width : 100%;
position : relative;
background-color : #25282a;
padding-top : 56px;
padding-bottom : 56px;
}
.p-home-news .p-home-news__wrap:before {
content : "";
display : block;
width : calc(100% - 15.8rem);
height : 1px;
background-image : url(../img/common/bg_line.svg);
background-repeat : repeat-x;
background-position : left top;
background-size : contain;
position : absolute;
left : 0;
top : 16px;
}
.p-home-news .p-home-news__wrap:after {
content : "";
display : block;
width : 15.8rem;
height : 14.8rem;
background-image : url(../img/common/bg_curve-line.svg);
background-repeat : no-repeat;
background-position : left top;
background-size : contain;
position : absolute;
right : 0;
top : 16px;
}
.p-home-news .p-home-news__inner {
padding-left : 15px;
padding-right : 15px;
margin-left : auto;
margin-right : auto;
display : flex;
flex-wrap : wrap;
justify-content : flex-start;
align-items : baseline;
position : relative;
z-index : 100;
}
@media screen and (min-width: 1024px) {
.p-home-news .p-home-news__inner {
max-width : 1110px;
justify-content : space-between;
}
}
.p-home-news .p-home-news-heading {
font-family : "UniNeueBold";
font-size : 24px;
font-size : 2.4rem;
color : #ffffff;
margin-right : 24px;
}
@media screen and (min-width: 1024px) {
.p-home-news .p-home-news-heading {
margin-right : 0;
}
}
.p-home-news .p-home-news-link {
font-family : "UniNeueBold";
font-size : 13px;
font-size : 1.3rem;
color : rgba(255, 255, 255, 0.5);
}
.p-home-news .p-home-news-link:after {
content : "";
display : inline-block;
background-image : url("data:image/svg+xml;utf8,");
background-repeat : no-repeat;
background-position : left top;
background-size : contain;
width : 1.4rem;
height : 1rem;
opacity : 0.5;
}
@media screen and (min-width: 1024px) {
.p-home-news .p-home-news-link {
order : 2;
margin-right : 96px;
}
}
.p-home-news .p-home-news-list {
margin-top : 40px;
line-height : 1.6;
width : 100%;
}
@media screen and (min-width: 1024px) {
.p-home-news .p-home-news-list {
width : auto;
flex-direction : row;
order : 1;
margin-top : 0;
}
}
.p-home-news .p-home-news-list .p-home-news-list__item {
display : flex;
flex-wrap : wrap;
margin-bottom : 16px;
}
.p-home-news .p-home-news-list .p-home-news-list__item.p-home-news-list__item--special {
width : calc(100% - 3em);
}
@media screen and (min-width: 768px) {
.p-home-news .p-home-news-list .p-home-news-list__item.p-home-news-list__item--special {
width : auto;
}
}
.p-home-news .p-home-news-list .p-home-news-list__date {
font-size : 16px;
font-size : 1.6rem;
color : rgba(255, 255, 255, 0.5);
margin-bottom : 16px;
font-family : "UniNeueBold";
}
@media screen and (min-width: 1024px) {
.p-home-news .p-home-news-list .p-home-news-list__date {
margin-right : 56px;
margin-bottom : 0;
}
}
.p-home-news .p-home-news-list .p-home-news-list__title {
font-size : 16px;
font-size : 1.6rem;
color : #ffffff;
width : 100%;
}
@media screen and (min-width: 1024px) {
.p-home-news .p-home-news-list .p-home-news-list__title {
width : 35em;
}
}
.p-home-title {
margin-bottom : 24px;
}
.p-home-title svg {
width : auto;
height : 3rem;
}
@media screen and (min-width: 1024px) {
.p-home-title {
margin-bottom : 32px;
}
}
.p-home-text {
font-size : 16px;
font-size : 1.6rem;
line-height : 2;
}
.p-home-button {
margin-top : 32px;
}
.p-home-recoverywear {
width : 100%;
position : relative;
background-color : #25282a;
padding-top : 32px;
padding-bottom : 56px;
margin-bottom : 96px;
}
@media screen and (min-width: 1024px) {
.p-home-recoverywear {
min-width : 1366px;
padding-top : 0;
padding-bottom : 120px;
margin-bottom : 160px;
}
}
.p-home-recoverywear .p-home-recoverywear__inner {
position : relative;
padding-left : 15px;
padding-right : 15px;
margin-left : auto;
margin-right : auto;
}
@media screen and (min-width: 1024px) {
.p-home-recoverywear .p-home-recoverywear__inner {
max-width : 1110px;
}
}
@media screen and (min-width: 1024px) {
.p-home-recoverywear .p-home-recoverywear-title {
padding-top : 56px;
}
}
.p-home-recoverywear .p-home-recoverywear-text {
color : #ffffff;
margin-bottom : 24px;
}
@media screen and (min-width: 1024px) {
.p-home-recoverywear .p-home-recoverywear-text {
margin-bottom : 0;
}
}
.p-home-recoverywear .p-home-recoverywear-button {
text-align : center;
}
@media screen and (min-width: 1024px) {
.p-home-recoverywear .p-home-recoverywear-button {
text-align : left;
}
}
@media screen and (min-width: 1024px) {
.p-home-recoverywear .p-home-recoverywear-img {
position : absolute;
right : 0;
top : 0;
}
}
.p-home-recoverywear .p-home-recoverywear-img .p-home-recoverywear-img01 , .p-home-recoverywear .p-home-recoverywear-img .p-home-recoverywear-img02 {
display : block;
width : 61.06vw;
height : auto;
box-shadow : 0 0 32px 0 rgba(0, 0, 0, 0.3);
}
@media screen and (min-width: 768px) {
.p-home-recoverywear .p-home-recoverywear-img .p-home-recoverywear-img01 , .p-home-recoverywear .p-home-recoverywear-img .p-home-recoverywear-img02 {
width : 74.16vw;
}
}
@media screen and (min-width: 1024px) {
.p-home-recoverywear .p-home-recoverywear-img .p-home-recoverywear-img01 , .p-home-recoverywear .p-home-recoverywear-img .p-home-recoverywear-img02 {
width : 445px;
}
}
.p-home-recoverywear .p-home-recoverywear-img .p-home-recoverywear-img01 {
margin-right : auto;
}
@media screen and (min-width: 1024px) {
.p-home-recoverywear .p-home-recoverywear-img .p-home-recoverywear-img01 {
margin-right : 0;
}
}
.p-home-recoverywear .p-home-recoverywear-img .p-home-recoverywear-img02 {
margin-top : -18.94vw;
margin-left : auto;
}
@media screen and (min-width: 768px) {
.p-home-recoverywear .p-home-recoverywear-img .p-home-recoverywear-img02 {
margin-top : -138px;
margin-left : auto;
}
}
@media screen and (min-width: 1024px) {
.p-home-recoverywear .p-home-recoverywear-img .p-home-recoverywear-img02 {
margin-left : 190px;
}
}
.p-home-user {
width : 100%;
height : auto;
position : relative;
}
@media screen and (min-width: 1024px) {
.p-home-user {
min-width : 1366px;
}
}
.p-home-user .p-home-user__inner {
width : 100%;
max-width : 1110px;
margin-left : auto;
margin-right : auto;
}
@media screen and (min-width: 768px) {
.p-home-user .p-home-user__inner {
position : absolute;
top : 0;
left : 50%;
transform : translateX(-50%);
}
}
.p-home-user .p-home-user-content {
position : relative;
z-index : 1;
box-sizing : border-box;
padding-left : 15px;
padding-right : 15px;
}
@media screen and (min-width: 768px) {
.p-home-user .p-home-user-content {
padding-left : 41.72vw;
padding-top : 5.27vw;
}
}
@media screen and (min-width: 1024px) {
.p-home-user .p-home-user-content {
padding-left : 570px;
padding-top : 72px;
}
}
.p-home-user .p-home-user-img {
min-width : 240px;
max-width : 858px;
width : 64vw;
margin-top : -20px;
}
@media screen and (min-width: 768px) {
.p-home-user .p-home-user-img {
margin-top : 0;
width : 62.81vw;
}
}
@media screen and (min-width: 1024px) {
.p-home-user .p-home-user-img {
width : 858px;
}
}
.p-home-initiatives {
width : 100%;
position : relative;
z-index : 1;
margin-top : -52px;
}
@media screen and (min-width: 1024px) {
.p-home-initiatives {
min-width : 1366px;
margin-top : -80px;
}
}
.p-home-initiatives .p-home-initiatives__inner {
display : flex;
align-items : center;
justify-content : space-between;
max-width : 1110px;
margin-left : auto;
margin-right : auto;
}
@media screen and (min-width: 1024px) {
.p-home-initiatives .p-home-initiatives__inner {
margin-right : 128px;
}
}
.p-home-initiatives .p-home-initiatives-content {
position : absolute;
left : 0;
z-index : 1;
width : 20em;
padding : 15px;
}
@media screen and (min-width: 768px) {
.p-home-initiatives .p-home-initiatives-content {
position : static;
width : auto;
left : auto;
}
}
.p-home-initiatives .p-home-initiatives-img {
box-shadow : 0 0 32px 0 rgba(0, 0, 0, 0.3);
width : 51.73vw;
min-width : 194px;
max-width : 635px;
margin-left : auto;
}
@media screen and (min-width: 768px) {
.p-home-initiatives .p-home-initiatives-img {
flex : 1 1 auto;
width : 46.48vw;
}
}
@media screen and (min-width: 1024px) {
.p-home-initiatives .p-home-initiatives-img {
width : 635px;
}
}
.p-home-company {
width : 100%;
position : relative;
margin-top : -56px;
margin-bottom : 96px;
}
@media screen and (min-width: 1024px) {
.p-home-company {
margin-top : -128px;
min-width : 1366px;
margin-bottom : 128px;
}
}
.p-home-company .p-home-company__wrap {
width : 100%;
min-height : 652px;
-webkit-mask-image : url("../img/home/home_company_mask_sm.svg");
-webkit-mask-repeat : no-repeat;
-webkit-mask-position : bottom right;
-webkit-mask-size : cover;
mask-image : url("../img/home/home_company_mask_sm.svg");
mask-repeat : no-repeat;
mask-position : bottom right;
mask-size : cover;
background-image : url("../img/home/home_company_img_sm.jpg");
background-repeat : no-repeat;
background-position : top center;
background-size : cover;
}
@media screen and (min-width: 768px) {
.p-home-company .p-home-company__wrap {
-webkit-mask-image : url("../img/home/home_company_mask_md.svg");
mask-image : url("../img/home/home_company_mask_md.svg");
background-image : url("../img/home/home_company_img.jpg");
}
}
@media screen and (min-width: 1024px) {
.p-home-company .p-home-company__wrap {
background-image : url("../img/home/home_company_img.jpg");
-webkit-mask-image : none;
mask-image : none;
}
}
@media screen and (min-width: 1920px) {
.p-home-company .p-home-company__wrap {
background-image : url("../img/home/home_company_img_lg.jpg");
}
}
.p-home-company .p-home-company__wrap:before {
content : "";
display : block;
width : 100%;
height : 100%;
background-color : rgba(0, 0, 0, 0.25);
position : absolute;
left : 0;
top : 0;
}
@media screen and (min-width: 1024px) {
.p-home-company .p-home-company__wrap:after {
content : "";
display : block;
width : 100%;
height : 12rem;
background-image : url("data:image/svg+xml;utf8,");
background-repeat : no-repeat;
background-position : right top;
background-size : contain;
position : absolute;
right : 0;
bottom : 0;
}
}
.p-home-company .p-home-company__inner {
position : absolute;
left : 50%;
top : 50%;
transform : translateY(-50%) translateX(-50%);
text-align : center;
width : calc(100% - 30px);
}
.p-home-company .p-home-company-text {
color : #ffffff;
text-align : left;
}
@media screen and (min-width: 768px) {
.p-home-company .p-home-company-text {
text-align : center;
}
}
.p-home-recovery-lab {
width : 100%;
margin-bottom : 128px;
}
@media screen and (min-width: 1024px) {
.p-home-recovery-lab {
min-width : 1366px;
}
}
.p-home-recovery-lab .p-home-recovery-lab__inner {
margin-left : auto;
margin-right : auto;
padding-left : 15px;
padding-right : 15px;
display : flex;
flex-direction : column;
}
@media screen and (min-width: 1024px) {
.p-home-recovery-lab .p-home-recovery-lab__inner {
flex-direction : row;
justify-content : center;
align-items : center;
max-width : 912px;
}
}
@media screen and (min-width: 768px) {
.p-home-recovery-lab .p-home-recovery-lab__content {
min-width : 25em;
}
}
@media screen and (min-width: 1024px) {
.p-home-recovery-lab .p-home-recovery-lab__content {
margin-left : 220px;
}
}
.p-home-recovery-lab .p-home-recovery-lab-logo {
text-align : center;
margin-bottom : 32px;
flex : 0 0 auto;
}
@media screen and (min-width: 768px) {
.p-home-recovery-lab .p-home-recovery-lab-text {
text-align : center;
}
}
@media screen and (min-width: 1024px) {
.p-home-recovery-lab .p-home-recovery-lab-text {
text-align : left;
}
}
.p-home-recovery-lab .p-home-recovery-button {
text-align : center;
}
@media screen and (min-width: 1024px) {
.p-home-recovery-lab .p-home-recovery-button {
text-align : left;
}
}
.p-home-banner {
margin-bottom : 90px;
}
@media screen and (min-width: 1024px) {
.p-home-banner {
min-width : 1366px;
}
}
.p-home-banner .p-home-banner__inner {
max-width : 1110px;
margin-left : auto;
margin-right : auto;
padding-left : 15px;
padding-right : 15px;
}
.p-home-banner .p-home-banner-list {
display : flex;
flex-direction : column;
flex-wrap : wrap;
gap : 20px;
}
@media screen and (min-width: 768px) {
.p-home-banner .p-home-banner-list {
flex-direction : row;
gap : 30px;
}
}
.p-home-banner .p-home-banner-list .p-home-banner-list__item {
width : 100%;
}
@media screen and (min-width: 768px) {
.p-home-banner .p-home-banner-list .p-home-banner-list__item {
width : calc((100% - 60px) / 3);
}
}
.p-home-banner .p-home-banner-furusato-tax {
margin-top : 20px;
}
@media screen and (min-width: 768px) {
.p-home-banner .p-home-banner-furusato-tax {
margin-top : 60px;
}
}
.p-home-contact {
padding-top : 72px;
padding-bottom : 120px;
background-color : rgba(242, 233, 219, 0.5);
}
@media screen and (min-width: 1024px) {
.p-home-contact {
padding-bottom : 176px;
}
}
.p-home-contact .p-home-contact__inner {
max-width : 1080px;
margin-left : auto;
margin-right : auto;
padding-left : 15px;
padding-right : 15px;
}
.p-home-contact .p-home-contact-title {
text-align : center;
margin-bottom : 32px;
}
.p-home-contact .p-home-contact-list {
display : flex;
flex-wrap : wrap;
flex-direction : column;
}
@media screen and (min-width: 768px) {
.p-home-contact .p-home-contact-list {
flex-direction : row;
}
}
.p-home-contact .p-home-contact-list .p-home-contact-list__item {
position : relative;
text-align : center;
box-sizing : border-box;
padding-bottom : 35px;
margin-bottom : 35px;
}
.p-home-contact .p-home-contact-list .p-home-contact-list__item:after {
content : "";
background-color : #25282a;
width : 51.2vw;
height : 1px;
display : inline-block;
position : absolute;
bottom : 0;
left : 50%;
transform : translateX(-50%);
}
.p-home-contact .p-home-contact-list .p-home-contact-list__item:last-child {
padding-bottom : 0;
margin-bottom : 0;
}
.p-home-contact .p-home-contact-list .p-home-contact-list__item:last-child:after {
display : none;
}
@media screen and (min-width: 768px) {
.p-home-contact .p-home-contact-list .p-home-contact-list__item {
border-right : 1px solid #25282a;
width : 50%;
padding-bottom : 0;
margin-bottom : 0;
}
.p-home-contact .p-home-contact-list .p-home-contact-list__item:after {
display : none;
}
.p-home-contact .p-home-contact-list .p-home-contact-list__item:last-child {
border-right : 0;
}
}
.p-home-contact .p-home-contact-list .p-home-contact-list__img {
margin-bottom : 24px;
}
.p-home-contact .p-home-contact-list .p-home-contact-list__text {
margin-bottom : 28px;
line-height : 1.6;
}
.p-home-contact .p-home-contact-list .p-home-contact-list__tel {
margin-bottom : 22px;
font-size : 32px;
font-size : 3.2rem;
letter-spacing : 0.1em;
}
.p-home-contact .p-home-contact-list .p-home-contact-list__button {
font-size : 14px;
font-size : 1.4rem;
}
/* initiative - project - object
--------------------------------------------------------- */
.p-initiative-list {
margin-bottom : 12rem;
}
.p-market-japan-recovery-association .p-market-japan-recovery-association__img {
max-width : 350px;
height : auto;
}
.p-market-anniversary .p-market-anniversary__list {
display : flex;
flex-wrap : wrap;
flex-direction : column;
}
@media screen and (min-width: 768px) {
.p-market-anniversary .p-market-anniversary__list {
flex-direction : row;
gap : 46px;
}
}
.p-market-anniversary .p-market-anniversary__item {
margin-bottom : 32px;
}
@media screen and (min-width: 768px) {
.p-market-anniversary .p-market-anniversary__item {
width : calc((100% - 46px) / 2);
margin-bottom : 0;
}
}
.p-market-anniversary .p-market-anniversary__item:last-child {
margin-bottom : 0;
}
.p-market-anniversary .p-market-anniversary__img {
text-align : center;
margin-bottom : 24px;
}
.p-market-anniversary .p-market-anniversary__img img {
max-width : 160px;
height : auto;
}
.p-market-anniversary .p-market-anniversary__title {
text-align : center;
margin-bottom : 24px;
}
.p-market-anniversary .p-market-anniversary__text {
font-size : 16px;
font-size : 1.6rem;
line-height : 2;
}
@media screen and (min-width: 768px) {
.p-market-anniversary .p-market-anniversary__text {
font-size : 13px;
font-size : 1.3rem;
}
}
.p-market-online-yoga .p-market-online-yoga__img {
max-width : 540px;
height : auto;
margin-right : auto;
margin-left : auto;
}
.p-pioneer-founder .p-pioneer-founder__list {
display : flex;
flex-direction : column;
align-items : center;
margin-top : 60px;
gap : 8.53vw;
}
@media screen and (min-width: 768px) {
.p-pioneer-founder .p-pioneer-founder__list {
flex-direction : row;
gap : 4.75vw;
}
}
@media screen and (min-width: 1024px) {
.p-pioneer-founder .p-pioneer-founder__list {
gap : 65px;
}
}
.p-pioneer-founder .p-pioneer-founder__list .p-pioneer-founder__item {
width : 53.33vw;
text-align : center;
}
@media screen and (min-width: 768px) {
.p-pioneer-founder .p-pioneer-founder__list .p-pioneer-founder__item {
width : 100%;
}
}
.p-pioneer-founder .p-pioneer-founder__list .p-pioneer-founder__img {
margin-bottom : 22px;
}
.p-pioneer-founder .p-pioneer-founder__list .p-pioneer-founder__name {
font-size : 16px;
font-size : 1.6rem;
margin-bottom : 5px;
}
.p-pioneer-founder .p-pioneer-founder__list .p-pioneer-founder__text {
font-size : 15px;
font-size : 1.5rem;
}
@media screen and (min-width: 768px) {
.p-randd__list {
display : flex;
}
.p-randd__img {
flex-shrink: 0;
width: 50%;
margin-top: 2.5em;
margin-right: 1em;
}
.p-randd__img_academics {
flex-shrink: 0;
margin: 2.5em auto 0;
}
.p-randd__img_books {
flex-shrink: 0;
width: 20%;
margin-right: 1em;
}
.p-randd__box1 {
margin-right: 20px;
}
}
@media screen and (max-width: 767px) {
.p-randd__img {
display: flex;
justify-content: center;
}
.p-randd__img_books {
display: flex;
justify-content: center;
}
}
.p-randd__books_01 {
margin-bottom: 1em;
}
.p-randd_text-b {
font-weight: bold;
}
.p-randd__list-text {
line-height: 1.5;
}
.p-customer-questionnaire .p-customer-questionnaire__img {
max-width : 540px;
height : auto;
margin-right : auto;
margin-left : auto;
}
.p-customer-rlm .p-customer-rlm__img {
max-width : 300px;
height : auto;
margin : 72px auto 48px;
}
.p-customer-rlm .p-customer-rlm-latest .p-customer-rlm-latest__title {
font-size : 18px;
font-size : 1.8rem;
font-weight : 700;
color : #ff6a14;
margin-bottom : 20px;
}
@media screen and (min-width: 768px) {
.p-customer-rlm .p-customer-rlm-latest .p-customer-rlm-latest-article {
display : flex;
align-items : flex-start;
align-items : center;
}
}
.p-customer-rlm .p-customer-rlm-latest .p-customer-rlm-latest-article .p-customer-rlm-latest-article__img {
margin-bottom : 12px;
}
@media screen and (min-width: 768px) {
.p-customer-rlm .p-customer-rlm-latest .p-customer-rlm-latest-article .p-customer-rlm-latest-article__img {
flex : 0 0 auto;
max-width : 350px;
margin-right : 30px;
}
}
.p-customer-rlm .p-customer-rlm-latest .p-customer-rlm-latest-article .p-customer-rlm-latest-article__caption {
display : flex;
flex-wrap : wrap;
}
.p-customer-rlm .p-customer-rlm-latest .p-customer-rlm-latest-article .p-customer-rlm-latest-article__title {
font-size : 16px;
font-size : 1.6rem;
line-height : 1.8;
width : 100%;
margin-bottom : 10px;
}
.p-customer-rlm .p-customer-rlm-latest .p-customer-rlm-latest-article .p-customer-rlm-latest-article__category {
display : inline;
font-size : 13px;
font-size : 1.3rem;
font-family : "UniNeueRegular", "BIZ UDPGothic", sans-serif;
line-height : 1.8;
}
.p-customer-rlm .p-customer-rlm-latest .p-customer-rlm-latest-article .p-customer-rlm-latest-article__category:after {
content : "|";
margin-left : 0.5em;
margin-right : 0.5em;
display : inline-block;
}
.p-customer-rlm .p-customer-rlm-latest .p-customer-rlm-latest-article .p-customer-rlm-latest-article__date {
font-size : 13px;
font-size : 1.3rem;
line-height : 1.8;
font-family : "UniNeueRegular", "BIZ UDPGothic", sans-serif;
}
.p-sdgs-logo {
max-width : 411px;
}
.p-sdgs-target {
display : flex;
align-items : center;
margin-bottom : 72px;
}
.p-sdgs-target .p-sdgs-target__img {
flex : 0 0 auto;
max-width : 150px;
margin-right : 24px;
}
.p-sdgs-target .p-sdgs-target__caption {
flex : 1 1 auto;
max-width : 352px;
}
.p-sdgs-target .p-sdgs-target__caption .p-sdgs-target__lead {
font-size : 13px;
font-size : 1.3rem;
font-weight : 700;
line-height : 2;
margin-bottom : 5px;
}
.p-sdgs-target .p-sdgs-target__caption .p-sdgs-target__text {
font-size : 13px;
font-size : 1.3rem;
line-height : 2;
}
.p-sdgs-green-nano-img {
max-width : 565px;
height : auto;
margin-right : auto;
margin-left : auto;
}
.p-community-corner-right .c-corner-right__inner img {
position : absolute;
bottom : 0;
}
.p-community-collab-1 .p-community-collab-1__img {
max-width : 730px;
height : auto;
margin : 64px auto;
}
.p-community-collab-2 .p-community-collab-2__img {
max-width : 485px;
height : auto;
margin : 64px auto;
}
.p-community-furusato-tax .p-community-furusato-tax__banner {
display : block;
max-width : 234px;
height : auto;
margin : 0 auto;
}
.p-staff-training .p-staff-training__title {
font-size : 22px;
font-size : 2.2rem;
line-height : 1.4;
margin-bottom : 1.2em;
font-weight : 700;
margin-top : 100px;
}
.p-staff-training .p-staff-training__model {
margin-bottom : 100px;
}
@media screen and (min-width: 1024px) {
.p-repair-corner-right {
top : -124px;
}
}
.p-repair-page-head {
min-height : auto;
}
@media screen and (min-width: 1024px) {
.p-repair-page-head {
padding-top : 24px;
margin-bottom : 108px;
}
}
@media screen and (min-width: 768px) {
.p-repair-recommend-list {
display : flex;
justify-content : center;
gap : 30px;
}
}
.p-repair-howto .p-repair-howto__title {
font-size : 32px;
font-size : 3.2rem;
line-height : 1.4;
margin-bottom : 1.2em;
text-align : center;
}
.p-repair-howto .p-repair-howto__list {
display : flex;
flex-wrap : wrap;
gap : 30px;
}
.p-repair-howto .p-repair-howto__list .p-repair-howto__item {
overflow : hidden;
border-radius : 6px;
}
@media screen and (min-width: 768px) {
.p-repair-howto .p-repair-howto__list .p-repair-howto__item {
width : calc((100% - 30px) / 2);
}
}
.p-repair-howto .p-repair-howto-point__list {
margin-bottom : 64px;
}
.p-repair-howto .p-repair-howto-point__list li {
margin-bottom : 30px;
}
.p-repair-howto .p-repair-howto-point__list li:after {
content : "";
display : block;
clear : both;
}
.p-repair-howto .p-repair-howto-point__list li:last-child {
margin-bottom : 0;
}
.p-repair-howto .p-repair-howto-point__list li .p-repair-howto-point__pict {
float : left;
margin-right : 32px;
width : 95px;
height : auto;
}
.p-repair-howto .p-repair-howto-point__list li .p-repair-howto-point__lead {
font-weight : 700;
font-size : 20px;
font-size : 2rem;
margin-bottom : 16px;
}
.p-repair-howto .p-repair-howto-point__list li .p-repair-howto-point__lead .p-repair-howto-point__small-lead {
font-size : 16px;
font-size : 1.6rem;
}
.p-repair-howto .p-repair-howto-point__list li .p-repair-howto-point__text {
font-size : 16px;
font-size : 1.6rem;
line-height : 1.5;
overflow : hidden;
}
.p-repair-service .p-repair-service__title {
font-size : 32px;
font-size : 3.2rem;
line-height : 1.4;
margin-bottom : 1.2em;
text-align : center;
}
.p-repair-service .p-repair-service__title .p-repair-service__small-title {
font-size : 24px;
font-size : 2.4rem;
}
.p-repair-service .p-repair-service__img {
display : flex;
flex-wrap : wrap;
justify-content : space-between;
gap : 30px;
margin-bottom : 60px;
}
.p-repair-service .p-repair-service__img li {
width : 100%;
overflow : hidden;
border-radius : 6px;
}
.p-repair-service .p-repair-service__img li:last-child {
margin-bottom : 0;
}
@media screen and (min-width: 768px) {
.p-repair-service .p-repair-service__img li {
width : calc((100% - 60px) / 3);
margin-bottom : 0;
}
}
.p-repair-service .p-repair-service-caution {
width : 100%;
max-width : 600px;
margin-left : auto;
margin-right : auto;
border : 1px solid #25282a;
padding : 32px;
margin-bottom : 96px;
box-sizing : border-box;
}
@media screen and (min-width: 1024px) {
.p-repair-service .p-repair-service-caution {
padding : 32px 56px;
}
}
.p-repair-service .p-repair-service-caution .p-repair-service-caution__title {
font-size : 13px;
font-size : 1.3rem;
font-weight : 700;
margin-bottom : 24px;
text-align : center;
}
.p-repair-service .p-repair-service-caution .p-repair-service-caution__list li {
font-size : 13px;
font-size : 1.3rem;
margin-bottom : 10px;
}
.p-repair-service .p-repair-service-caution .p-repair-service-caution__list li:last-child {
margin-bottom : 0;
}
.p-repair-service .p-repair-service-flow {
margin-bottom : 95px;
}
.p-repair-service .p-repair-service-flow li:first-of-type {
align-items : center;
}
.p-repair-service .p-repair-service-flow li:first-of-type dt {
margin-bottom : 0;
}
.p-repair-service .p-repair-destination {
border : 1px solid #25282a;
text-align : center;
padding : 32px;
box-sizing : border-box;
margin-top : 16px;
}
@media screen and (min-width: 1024px) {
.p-repair-service .p-repair-destination {
padding : 32px 56px;
}
}
.p-repair-service .p-repair-destination .p-repair-destination__title {
margin-bottom : 16px;
font-size : 13px;
font-size : 1.3rem;
font-weight : bold;
line-height : 2;
}
.p-repair-service .p-repair-destination .p-repair-destination__address {
margin-bottom : 16px;
font-size : 13px;
font-size : 1.3rem;
line-height : 2;
}
.p-repair-service .p-repair-destination .p-repair-destination__phone {
font-size : 24px;
font-size : 2.4rem;
color : #ff6a14;
}
.p-repair-completion-page-head {
min-height : auto;
margin-bottom : 30px;
}
@media screen and (min-width: 768px) {
.p-repair-completion {
max-width : 500px;
margin-left : auto;
margin-right : auto;
}
}
.p-repair-address {
text-align : center;
border : 1px solid #25282a;
box-sizing : border-box;
padding : 32px;
margin-bottom : 70px;
text-align : center;
font-size : 13px;
font-size : 1.3rem;
}
@media screen and (min-width: 768px) {
.p-repair-address {
padding : 32px 56px;
}
}
.p-repair-address p {
line-height : 1.6;
}
.p-repair-address .p-repair-address__title {
font-size : 13px;
font-size : 1.3rem;
font-weight : 700;
margin-bottom : 16px;
line-height : 2;
}
.p-repair-address .p-repair-address__text {
font-size : 13px;
font-size : 1.3rem;
line-height : 2;
}
.p-repair-precaution_list {
margin-top: 1em;
margin-bottom: 1em;
font-size: 1.5rem;
}
.p-repair-banner {
margin-bottom: 2em;
text-align: center;
}
/* news - project - object
--------------------------------------------------------- */
.p-news-category {
margin-bottom : 48px;
}
@media screen and (min-width: 768px) {
.p-news-category {
margin-bottom : 120px;
}
}
@media screen and (min-width: 1024px) {
.p-news-category {
width : 33.67vw;
}
}
.p-news-archive {
margin-bottom : 12rem;
}
.p-news-article {
margin-bottom : 12rem;
}
.p-news-pagenation {
margin-top : 80px;
}
/* privacy - project - object
--------------------------------------------------------- */
.p-privacy-page-head {
min-height : auto;
margin-bottom : 48px;
}
.p-privacy-basicpolicy-page-head {
min-height : auto;
}
@media screen and (min-width: 1024px) {
.p-privacy-basicpolicy-page-head {
margin-bottom : -37px;
}
}
.p-privacy-contact {
border-top : 1px solid #25282a;
border-bottom : 1px solid #25282a;
padding : 50px 30px;
}
.p-privacy-contact .p-privacy-contact__title {
line-height : 2;
font-weight : 700;
}
.p-privacy-contact .p-privacy-contact__text {
font-size : 14px;
font-size : 1.4rem;
line-height : 2;
}
.p-privacy-contact + .p-privacy-contact {
border-top : 0;
}
.p-privacy-mark {
width : 115px;
height : 115px;
margin-top : 40px;
}
.p-privacy-list {
counter-reset : privacy-list-counter;
}
.p-privacy-list .p-privacy-list__item {
padding-left : 30px;
position : relative;
}
.p-privacy-list .p-privacy-list__title {
font-size : 16px;
font-size : 1.6rem;
line-height : 2;
font-weight : bold;
margin-bottom : 8px;
}
.p-privacy-list .p-privacy-list__title:before {
content : counter(privacy-list-counter) ".";
counter-increment : privacy-list-counter;
display : inline;
font-family : "UniNeueBold";
font-weight : normal;
font-size : 18px;
font-size : 1.8rem;
position : absolute;
left : 0;
}
.p-privacy-list .p-privacy-list__description {
font-size : 16px;
font-size : 1.6rem;
line-height : 2;
margin-bottom : 45px;
}
.p-privacy-list .p-privacy-list__description > *:last-child {
margin-bottom : 0;
}
.p-privacy-list .p-privacy-list__description p {
margin-bottom : 1.25em;
}
.p-privacy-list .p-privacy-list__description ol , .p-privacy-list .p-privacy-list__description ul {
line-height : 2;
}
.p-privacy-list .p-privacy-list__description ol > li , .p-privacy-list .p-privacy-list__description ul > li {
margin-bottom : 32px;
}
.p-privacy-list .p-privacy-list__description ol > li:last-child , .p-privacy-list .p-privacy-list__description ul > li:last-child {
margin-bottom : 0;
}
.p-privacy-list .p-privacy-list__description ol.c-list-indent li {
line-height : 1.75;
margin-bottom : 1em;
}
.p-privacy-list .p-privacy-list__description table {
font-size : 14px;
font-size : 1.4rem;
line-height : 1.6;
}
.p-privacy-list .p-privacy-list__description table tr {
border-top : 1px solid #25282a;
}
.p-privacy-list .p-privacy-list__description table tr:last-child {
border-bottom : 1px solid #25282a;
}
.p-privacy-list .p-privacy-list__description table th {
font-weight : 700;
padding : 12px 0;
}
.p-privacy-list .p-privacy-list__description table td {
padding : 16px 0;
}
.p-privacy-list .p-privacy-list__description .p-privacy-contact {
padding : 32px;
}
.p-privacy-list .p-privacy-list__indent {
padding-left : 2em;
}
/* recovery_lab_magazine - project - object
--------------------------------------------------------- */
@media screen and (min-width: 1024px) {
.recovery_lab_magazine {
background-image : url("../img/recovery_lab_magazine/head_bg.svg");
background-repeat : no-repeat;
background-position : right top 373px;
background-size : 145px 108px;
}
}
.p-rlm-content {
margin-bottom : 12rem;
}
.p-rlm-logo {
margin-bottom : 96px;
text-align : center;
}
.p-rlm-category:after {
content : "|";
margin-left : 0.5em;
margin-right : 0.5em;
display : inline-block;
}
.p-rlm-pagenation {
margin-top : 72px;
}
.p-rlm-content__sub {
width : 100%;
max-width : 255px;
margin-left : auto;
margin-right : auto;
}
@media screen and (min-width: 768px) {
.p-rlm-content__sub {
max-width : calc(100% - 156px);
padding-left : 78px;
padding-right : 78px;
}
}
@media screen and (min-width: 1024px) {
.p-rlm-content__sub {
max-width : 220px;
padding-left : 0;
padding-right : 0;
margin-left : 96px;
}
}
@media screen and (min-width: 1024px) {
.p-rlm-content__sub--top {
padding-top : 193px;
}
}
.p-rlm-page-head-latest {
width : 100%;
height : 480px;
overflow : hidden;
position : relative;
padding-top : 0;
background-repeat : no-repeat;
background-position : center top;
background-size : cover;
color : #ffffff;
margin-left : calc(50% - 50vw);
margin-right : calc(50% - 50vw);
padding-left : calc(50vw - 50%);
padding-right : calc(50vw - 50%);
}
@media screen and (min-width: 1024px) {
.p-rlm-page-head-latest {
margin-right : 0;
margin-left : calc(50% - 50vw);
padding-left : calc(50vw - 50%);
padding-right : 48px;
background-position : left top;
}
}
.p-rlm-page-head-latest:before {
content : "";
background-image : url("../img/recovery_lab_magazine/head_cover@sm.svg");
background-repeat : no-repeat;
background-position : left top;
background-size : contain;
width : 273px;
height : 325px;
position : absolute;
top : 0;
right : 0;
}
@media screen and (min-width: 1024px) {
.p-rlm-page-head-latest:before {
background-image : url("../img/recovery_lab_magazine/head_cover.svg");
width : 402px;
height : 480px;
}
}
.p-rlm-page-head-latest .p-rlm-page-head-latest__inner {
position : absolute;
bottom : 48px;
left : 0;
padding-left : 15px;
padding-right : 15px;
}
@media screen and (min-width: 1024px) {
.p-rlm-page-head-latest .p-rlm-page-head-latest__inner {
left : auto;
}
}
.p-rlm-page-head-latest .p-rlm-page-head-latest__title {
flex : 0 0 auto;
max-width : 9em;
font-size : 24px;
font-size : 2.4rem;
line-height : 1.4;
font-family : "UniNeueRegular", "BIZ UDPGothic", sans-serif;
margin-bottom : 22px;
text-shadow : 0 0 16px rgba(0, 0, 0, 0.4);
}
@media screen and (min-width: 768px) {
.p-rlm-page-head-latest .p-rlm-page-head-latest__title {
max-width : 28em;
}
}
@media screen and (min-width: 1024px) {
.p-rlm-page-head-latest .p-rlm-page-head-latest__title {
max-width : 20em;
}
}
.p-rlm-page-head-latest .p-rlm-page-head-latest__meta {
text-shadow : 0 0 16px rgba(0, 0, 0, 0.4);
}
.p-rlm-page-head-latest .p-rlm-page-head-latest__category {
display : inline;
font-size : 16px;
font-size : 1.6rem;
line-height : 1.8;
}
.p-rlm-page-head-latest .p-rlm-page-head-latest__date {
font-size : 16px;
font-size : 1.6rem;
line-height : 1.8;
}
.p-rlm-page-head-latest .p-rlm-page-head-latest__button {
width : 100%;
margin-top : 32px;
}
.p-rlm-page-head-latest .p-rlm-page-head-latest__img {
position : absolute;
right : 0;
top : 0;
}
.p-rlm-page-head-category {
padding-top : 32vw;
margin-bottom : 56px;
}
@media screen and (min-width: 768px) {
.p-rlm-page-head-category {
padding-top : 40px;
margin-bottom : 80px;
}
}
@media screen and (min-width: 1024px) {
.p-rlm-page-head-category {
padding-top : 20px;
min-height : 188px;
}
}
.p-rlm-page-head-category .c-page-title {
position : relative;
font-size : 28px;
font-size : 2.8rem;
line-height : 1.4;
font-family : "UniNeueRegular", "BIZ UDPGothic", sans-serif;
margin-bottom : 40px;
}
@media screen and (min-width: 1024px) {
.p-rlm-page-head-category .c-page-title {
font-size : 40px;
font-size : 4rem;
}
}
.p-rlm-page-head-category .c-page-title__main:after {
content : "";
display : inline-block;
vertical-align : middle;
width : 0.5em;
height : 0.5em;
border : 2px solid #25282a;
border-left : 0;
border-bottom : 0;
box-sizing : border-box;
transform : translateY(-25%) rotate(135deg);
margin-left : 16px;
}
@media screen and (min-width: 1024px) {
.p-rlm-page-head-category .c-page-title__main:after {
display : none;
}
}
.p-rlm-category-dropdown {
display : none;
position : absolute;
left : 0;
top : -48px;
width : 100%;
margin-left : auto;
margin-right : auto;
border-radius : 9px;
background-color : #ffffff;
box-shadow : 0 8px 16px rgba(0, 0, 0, 0.32);
padding : 20px;
box-sizing : border-box;
flex-direction : column;
}
.p-rlm-category-dropdown .p-rlm-category-dropdown__link {
display : flex;
align-items : center;
font-size : 16px;
font-size : 1.6rem;
}
.p-rlm-category-dropdown .p-rlm-category-dropdown__link:before {
content : "";
display : inline-block;
vertical-align : middle;
width : 0.5em;
height : 0.5em;
border : 1px solid #25282a;
border-left : 0;
border-bottom : 0;
box-sizing : border-box;
transform : translateX(25%) rotate(-135deg);
margin-right : 12px;
}
.p-rlm-category-dropdown .p-rlm-category-dropdown__title {
font-size : 32px;
font-size : 3.2rem;
color : #ff6a14;
margin : 10px 0 12px;
}
.p-rlm-category-dropdown .p-rlm-category-dropdown-list {
font-size : 16px;
font-size : 1.6rem;
font-family : "UniNeueBold", "BIZ UDPGothic", sans-serif;
line-height : 1.4;
}
.p-rlm-category-dropdown .p-rlm-category-dropdown-list__item {
line-height : 1.4;
margin-bottom : 10px;
}
.p-rlm-category-dropdown .p-rlm-category-dropdown-list__item:before {
content : "";
display : inline-block;
vertical-align : middle;
width : 0.5em;
height : 0.5em;
border : 1px solid #25282a;
border-left : 0;
border-bottom : 0;
box-sizing : border-box;
transform : translateX(-25%) rotate(45deg);
margin-right : 12px;
}
.p-rlm-category-dropdown .p-rlm-category-dropdown-list__item:last-child {
margin-bottom : 0;
}
@media screen and (min-width: 1024px) {
.p-rlm-category-dropdown {
display : none;
}
}
.p-rlm-category-dropdown.is-open {
display : flex;
}
.p-rlm-article .p-rlm-article-head {
margin-bottom : 20px;
padding-top : 60px;
}
@media screen and (min-width: 768px) {
.p-rlm-article .p-rlm-article-head {
margin-bottom : 50px;
padding-top : 40px;
}
}
@media screen and (min-width: 1024px) {
.p-rlm-article .p-rlm-article-head {
padding-top : 20px;
}
}
.p-rlm-article .p-rlm-article-head .p-rlm-article-head__img {
margin-left : -15px;
margin-right : -15px;
margin-bottom : 25px;
}
.p-rlm-article .p-rlm-article-head .p-rlm-article-head__img img {
width : 100%;
}
@media screen and (min-width: 768px) {
.p-rlm-article .p-rlm-article-head .p-rlm-article-head__img {
width : 100%;
margin-left : 0;
margin-right : 0;
margin-bottom : 40px;
}
}
.p-rlm-article .p-rlm-article-head .p-rlm-article-head__title {
width : 100%;
line-height : 1.4;
font-size : 24px;
font-size : 2.4rem;
margin-bottom : 25px;
}
@media screen and (min-width: 768px) {
.p-rlm-article .p-rlm-article-head .p-rlm-article-head__title {
font-size : 32px;
font-size : 3.2rem;
margin-bottom : 20px;
}
}
.p-rlm-article .p-rlm-article-head .p-rlm-article-head__category {
font-size : 13px;
font-size : 1.3rem;
line-height : 1.8;
display : inline;
}
.p-rlm-article .p-rlm-article-head .p-rlm-article-head__date {
font-size : 13px;
font-size : 1.3rem;
font-family : "UniNeueRegular", "BIZ UDPGothic", sans-serif;
line-height : 1.8;
}
.p-rlm-article .p-rlm-article-content {
font-size : 16px;
font-size : 1.6rem;
}
.p-rlm-article .p-rlm-article-content h2:not([class]) {
font-size : 20px;
font-size : 2rem;
font-weight : 700;
line-height : 1.6;
margin-bottom : 1.4em;
}
@media screen and (min-width: 768px) {
.p-rlm-article .p-rlm-article-content h2:not([class]) {
font-size : 24px;
font-size : 2.4rem;
}
}
.p-rlm-article .p-rlm-article-content h2:not(:first-child) {
margin-top : 3.4em;
}
.p-rlm-article .p-rlm-article-content p:not([class]) {
margin-bottom : 2em;
line-height : 2;
}
.p-rlm-article .p-rlm-article-content .c-article-text-small {
font-size : 13px;
font-size : 1.3rem;
line-height : 2;
margin-bottom : 2em;
}
.p-rlm-article .p-rlm-article-content img:not([class]) {
margin-left : auto;
margin-right : auto;
display : block;
margin-top : 2em;
margin-bottom : 2em;
}
.p-rlm-article .p-rlm-article-content ul:not([class]) {
list-style : inside;
line-height : 2;
}
.p-rlm-article .p-rlm-article-content ul:not([class]) li {
text-indent : -1em;
padding-left : 1em;
}
.p-rlm-sns {
margin-top : 48px;
margin-bottom : 96px;
}
@media screen and (min-width: 768px) {
.p-rlm-sns {
margin-top : 96px;
}
}
.p-rlm-latest .p-rlm-latest__title {
font-family : "UniNeueRegular";
font-size : 32px;
font-size : 3.2rem;
line-height : 1.6;
margin-bottom : 32px;
}
.p-rlm-archive-card {
display : flex;
flex-wrap : wrap;
gap : 50px 30px;
}
.p-rlm-archive-card .p-rlm-archive-card-item {
width : 100%;
}
@media screen and (min-width: 768px) {
.p-rlm-archive-card .p-rlm-archive-card-item {
width : calc((100% - 30px) / 2);
}
}
.p-rlm-archive-card .p-rlm-archive-card-item .p-rlm-archive-card-item__img {
margin-bottom : 12px;
}
.p-rlm-archive-card .p-rlm-archive-card-item .p-rlm-archive-card-item__title {
font-size : 16px;
font-size : 1.6rem;
line-height : 1.6;
width : 100%;
margin-bottom : 12px;
}
.p-rlm-archive-card .p-rlm-archive-card-item .p-rlm-archive-card-item__category {
display : inline;
font-size : 13px;
font-size : 1.3rem;
line-height : 1.8;
font-family : "UniNeueRegular", "BIZ UDPGothic", sans-serif;
}
.p-rlm-archive-card .p-rlm-archive-card-item .p-rlm-archive-card-item__category:after {
content : "|";
margin-left : 0.5em;
margin-right : 0.5em;
display : inline-block;
}
.p-rlm-archive-card .p-rlm-archive-card-item .p-rlm-archive-card-item__date {
line-height : 1.8;
font-size : 13px;
font-size : 1.3rem;
font-family : "UniNeueRegular", "BIZ UDPGothic", sans-serif;
}
.p-rlm-section-sub-title {
color : rgba(37, 40, 42, 0.5);
}
/* recoverywear - project - object
--------------------------------------------------------- */
.p-recoverywear-list {
margin-bottom : 12rem;
}
.p-commitment-dpv576 .p-commitment-dpv576__graph {
position : relative;
margin-top : 75px;
margin-bottom : 72px;
}
.p-commitment-dpv576 .p-commitment-dpv576__graph .p-commitment-dpv576__list {
position : absolute;
left : 0;
top : 7.46vw;
width : 12em;
}
@media screen and (min-width: 768px) {
.p-commitment-dpv576 .p-commitment-dpv576__graph .p-commitment-dpv576__list {
position : relative;
display : flex;
justify-content : flex-end;
width : 100%;
left : auto;
top : auto;
margin-bottom : 24px;
}
}
.p-commitment-dpv576 .p-commitment-dpv576__graph .p-commitment-dpv576__list li {
font-size : 16px;
font-size : 1.6rem;
font-weight : 700;
line-height : 1.4;
margin-bottom : 6.4vw;
}
@media screen and (min-width: 768px) {
.p-commitment-dpv576 .p-commitment-dpv576__graph .p-commitment-dpv576__list li {
width : 8em;
margin-bottom : 0;
margin-left : 17px;
margin-right : 17px;
}
}
.p-commitment-dpv576 .p-commitment-dpv576__graph .p-commitment-dpv576__list li:before {
display : block;
}
.p-commitment-dpv576 .p-commitment-dpv576__small-text p {
margin-bottom : 16px;
}
.p-technology-pht .p-technology-pht__img {
margin-top : 72px;
margin-left : auto;
margin-right : auto;
}
@media screen and (min-width: 768px) {
.p-technology-pht .p-technology-pht__img {
max-width : 630px;
}
}
.p-technology-process .p-technology-process__list {
margin-bottom : 72px;
}
.p-technology-evaluation .p-technology-evaluation__list {
display : flex;
flex-direction : column;
flex-wrap : wrap;
gap : 32px;
margin-top : 72px;
margin-bottom : 72px;
}
@media screen and (min-width: 768px) {
.p-technology-evaluation .p-technology-evaluation__list {
flex-direction : row;
}
}
.p-technology-evaluation .p-technology-evaluation__item {
width : 100%;
}
@media screen and (min-width: 768px) {
.p-technology-evaluation .p-technology-evaluation__item {
width : calc((100% - 64px) / 3);
}
}
.p-technology-evaluation .p-technology-evaluation__img {
margin-bottom : 16px;
display : flex;
align-items : center;
justify-content : center;
}
@media screen and (min-width: 768px) {
.p-technology-evaluation .p-technology-evaluation__img {
min-height : 160px;
}
}
.p-technology-evaluation .p-technology-evaluation__text {
font-size : 16px;
font-size : 1.6rem;
line-height : 1.4;
}
.p-technology-evaluation .p-technology-evaluation__item--ispo .p-technology-evaluation__img img {
width : 160px;
height : auto;
}
.p-product-timing .p-product-timing__group {
display : flex;
justify-content : space-between;
gap : 16px;
margin-top : 40px;
}
.p-product-timing .p-product-timing__pict {
max-width : 95px;
}
.p-product-series .p-product-series__title {
margin-top : 100px;
margin-bottom : 100px;
}
.p-product-series .p-product-series__list {
display : flex;
flex-wrap : wrap;
gap : 100px 30px;
}
.p-product-series .p-product-series__item {
width : 100%;
display : flex;
flex-direction : column;
}
@media screen and (min-width: 768px) {
.p-product-series .p-product-series__item {
width : calc((100% - 30px) / 2);
}
}
.p-product-series .p-product-series__header {
border-bottom : 1px solid #25282a;
padding-bottom : 24px;
margin-bottom : 28px;
}
.p-product-series .p-product-series__title-en {
font-size : 24px;
font-size : 2.4rem;
color : #ff6a14;
font-family : "UniNeueBold";
text-align : center;
line-height : 1.4;
letter-spacing : 0.18em;
margin-bottom : 5px;
}
.p-product-series .p-product-series__title-jp {
font-size : 14px;
font-size : 1.4rem;
text-align : center;
line-height : 1.4;
font-weight : 700;
}
.p-product-series .p-product-series__lead {
font-size : 18px;
font-size : 1.8rem;
text-align : center;
line-height : 1.4;
font-weight : 700;
margin-bottom : 8px;
}
.p-product-series .p-product-series__text {
font-size : 14px;
font-size : 1.4rem;
line-height : 2;
margin-bottom : 24px;
}
.p-product-series .p-product-series__button {
text-align : center;
margin-top : auto;
}
.p-product-series .p-product-series__button .c-button {
font-size : 13px;
font-size : 1.3rem;
min-width : 290px;
margin-left : auto;
margin-right : auto;
}
.p-award-history {
max-width : 730px;
margin-top : 72px;
}
@media screen and (min-width: 768px) {
.p-award-history {
margin-top : 140px;
}
}
.p-award-history .p-award-history__title {
font-weight : 700;
margin-bottom : 24px;
}
.p-award-history .p-award-history__table {
table-layout : auto;
line-height : 1.8;
margin-bottom : 40px;
}
.p-award-history .p-award-history__table th {
width : 3em;
white-space : nowrap;
text-align : right;
font-weight : normal;
padding-right : 24px;
}
.p-award-history .p-award-history__table td {
padding-bottom : 16px;
}
.p-award-history .p-award-history__table tr:last-child td {
padding-bottom : 0;
}
.p-award-history .p-award-history__link {
font-size : 12px;
font-size : 1.2rem;
text-decoration : underline;
font-weight : 700;
transition : all 0.25s ease-out;
}
.p-award-history .p-award-history__link:after {
content : "";
background-image : url("data:image/svg+xml;utf8,");
background-repeat : no-repeat;
background-position : center;
background-size : contain;
width : 9px;
height : 11px;
display : inline-block;
margin-left : 6px;
}
.p-award-history .p-award-history__link:hover {
text-decoration : none;
}
.p-award-detail .p-award-ispo__gold-medal {
width : 42.66vw;
height : auto;
margin-bottom : 24px;
margin-left : auto;
margin-right : auto;
}
@media screen and (min-width: 768px) {
.p-award-detail .p-award-ispo__gold-medal {
width : 200px;
margin-left : 48px;
margin-bottom : 48px;
margin-right : 0;
float : right;
}
}
.p-award-detail .p-award-detail__img {
max-width : 540px;
height : auto;
margin-right : auto;
margin-left : auto;
}
.p-award-detail .p-award-oeko-tex__chart {
margin-top : 100px;
}
.p-award-ebhsrb .p-award-ebhsrb__list {
line-height : 1.8;
}
.p-award-ebhsrb .p-award-ebhsrb__list li {
margin-bottom : 1em;
}
.p-award-detail .p-award-me-byo__logo {
margin-bottom : 32px;
max-width : 280px;
margin-left : auto;
margin-right : auto;
}
@media screen and (min-width: 768px) {
.p-award-detail .p-award-me-byo__logo {
margin-left : 48px;
margin-bottom : 0;
float : right;
min-height : 240px;
display : inline-flex;
align-items : center;
}
}
@media screen and (min-width: 768px) {
.p-story-page-head {
margin-bottom : 76px;
}
}
/* recruit - project - object
--------------------------------------------------------- */
@media screen and (min-width: 768px) {
.p-recruit-page-head {
margin-bottom : 76px;
}
}
@media screen and (min-width: 768px) {
.p-recruit-entry-page-head {
min-height : auto;
margin-bottom : 168px;
}
}
.p-recruit-completion-page-head {
min-height : auto;
margin-bottom : 30px;
}
/* store - project - object
--------------------------------------------------------- */
.p-store-category {
margin-bottom : 48px;
}
@media screen and (min-width: 768px) {
.p-store-category {
margin-bottom : 120px;
}
}
@media screen and (min-width: 1024px) {
.p-store-category {
width : 33.67vw;
}
}
.p-store-list {
margin-bottom : 12rem;
}
.p-store-section {
margin-bottom : 72px;
}
.p-store-section:last-of-type {
margin-bottom : 170px;
}
.p-store-section .p-store-2-level {
font-size : 16px;
font-size : 1.6rem;
font-weight : bold;
margin-bottom : 32px;
}
.p-store-section .p-store-3-level {
font-size : 16px;
font-size : 1.6rem;
font-weight : bold;
position : relative;
padding-left : 40px;
margin-bottom : 32px;
}
.p-store-section .p-store-3-level:before {
content : "";
width : 25px;
height : 1px;
background-color : #25282a;
display : inline-block;
position : absolute;
top : 50%;
left : 0;
transform : translateY(-50%);
}
.p-store-section .p-store-3-level:first-of-type {
margin-top : 0;
}
.p-store-section .p-store-item {
padding-left : 40px;
margin-bottom : 45px;
}
.p-store-section .p-store-item .p-store-item__label {
font-size : 13px;
font-size : 1.3rem;
display : inline-block;
background-color : #25282a;
color : #ffffff;
font-weight : 700;
padding : 0.35rem 1rem;
margin-bottom : 4px;
}
.p-store-section .p-store-item .p-store-item__label + .p-store-item__label {
margin-left : 12px;
}
.p-store-section .p-store-item .p-store-item__name {
font-size : 1.8rem;
line-height : 1.75;
margin-bottom : 8px;
}
.p-store-section .p-store-item .p-store-item__info {
font-size : 1.4rem;
line-height : 1.75;
margin-bottom : 14px;
}
.p-store-section .p-store-item .p-store-item__button {
font-size : 13px;
font-size : 1.3rem;
}
.p-store-section .p-store-item .p-store-item__button .c-button {
min-width : 250px;
}
.p-store-section .p-store-item .p-store-item__img {
margin-bottom : 14px;
}
@media screen and (min-width: 768px) {
.p-store-section .p-store-item .p-store-item__img {
max-width : 350px;
height : auto;
}
}
.p-store-ecsite .p-store-ecsite__text {
font-size : 16px;
font-size : 1.6rem;
line-height : 1.75;
margin-bottom : 20px;
}
.p-store-ecsite .p-store-ecsite__list {
display : flex;
flex-wrap : wrap;
gap : 35px;
}
.p-store-ecsite .p-store-ecsite__title {
font-size : 16px;
font-size : 1.6rem;
line-height : 2;
font-weight : 700;
margin-bottom : 8px;
}
.p-store-ecsite .p-store-ecsite__button {
font-size : 13px;
font-size : 1.3rem;
}
.p-store-ecsite .p-store-ecsite__button .c-button {
min-width : 220px;
}
/* ambassador - project - object
--------------------------------------------------------- */
.p-user-list {
margin-bottom : 12rem;
}
.p-supportteam-archive {
margin-bottom : 12rem;
}
.p-supportteam-archive .p-supportteam-archive-list {
display : flex;
flex-wrap : wrap;
gap : 30px;
}
@media screen and (min-width: 768px) {
.p-supportteam-archive .p-supportteam-archive-list {
gap : 96px 30px;
}
}
.p-supportteam-archive .p-supportteam-archive-item {
display : flex;
flex-direction : column;
}
@media screen and (min-width: 768px) {
.p-supportteam-archive .p-supportteam-archive-item {
width : calc((100% - 60px) / 3);
}
}
.p-supportteam-archive .p-supportteam-archive-item .p-supportteam-archive-item__head {
margin-bottom : 16px;
}
.p-supportteam-archive .p-supportteam-archive-item .p-supportteam-archive-item__label {
display : inline-block;
background-color : #25282a;
color : #ffffff;
font-size : 16px;
font-size : 1.6rem;
font-weight : 700;
padding : 0 0.8em;
margin-bottom : 12px;
line-height : 1.65;
}
.p-supportteam-archive .p-supportteam-archive-item .p-supportteam-archive-item__main {
font-size : 22px;
font-size : 2.2rem;
line-height : 1.4;
font-weight : 700;
}
.p-supportteam-archive .p-supportteam-archive-item .p-supportteam-archive-item__img {
margin-top : auto;
margin-bottom : 20px;
}
.p-supportteam-archive .p-supportteam-archive-item .p-supportteam-archive-item__text {
font-size : 16px;
font-size : 1.6rem;
line-height : 1.6;
}
.p-supportteam-archive .p-supportteam-archive-item .p-supportteam-archive-item__button {
margin-top : 22px;
font-size : 13px;
font-size : 1.3rem;
}
.p-supportteam-archive .p-supportteam-archive-item .p-supportteam-archive-item__button .c-button {
min-width : 160px;
}
.p-ambassador-archive {
margin-bottom : 12rem;
}
.p-ambassador-archive .p-ambassador-archive-item {
display : flex;
flex-direction : column;
align-items : flex-start;
margin-bottom : 30px;
}
@media screen and (min-width: 768px) {
.p-ambassador-archive .p-ambassador-archive-item {
flex-direction : row;
align-items : center;
}
}
.p-ambassador-archive .p-ambassador-archive-item:last-child {
margin-bottom : 0;
}
.p-ambassador-archive .p-ambassador-archive-item .p-ambassador-archive-item__img {
margin-bottom : 24px;
}
@media screen and (min-width: 768px) {
.p-ambassador-archive .p-ambassador-archive-item .p-ambassador-archive-item__img {
flex : 0 0 350px;
margin-bottom : 0;
}
}
@media screen and (min-width: 768px) {
.p-ambassador-archive .p-ambassador-archive-item .p-ambassador-archive-item__caption {
margin-left : 36px;
}
}
.p-ambassador-archive .p-ambassador-archive-item .p-ambassador-archive-item__label {
display : inline-block;
background-color : #25282a;
color : #ffffff;
font-size : 16px;
font-size : 1.6rem;
font-weight : 700;
padding : 0 0.8em;
margin-bottom : 12px;
line-height : 1.65;
}
.p-ambassador-archive .p-ambassador-archive-item .p-ambassador-archive-item__main {
font-size : 22px;
font-size : 2.2rem;
font-weight : 700;
margin-bottom : 8px;
}
.p-ambassador-archive .p-ambassador-archive-item .p-ambassador-archive-item__sub {
font-size : 16px;
font-size : 1.6rem;
font-weight : 700;
line-height : 1.6;
}
.p-ambassador-archive .p-ambassador-archive-item .p-ambassador-archive-item__text {
font-size : 16px;
font-size : 1.6rem;
line-height : 1.6;
margin-top : 16px;
}
.p-ambassador-archive .p-ambassador-archive-item .p-ambassador-archive-item__button {
margin-top : 22px;
font-size : 13px;
font-size : 1.3rem;
}
.p-ambassador-archive .p-ambassador-archive-item .p-ambassador-archive-item__button .c-button {
min-width : 160px;
}
.p-user-single {
margin-bottom : 12rem;
padding-top : 60px;
}
@media screen and (min-width: 1024px) {
.p-user-single {
padding-top : 0;
}
}
.p-user-article {
padding-top : 0;
}
.p-user-article .p-user-article-head {
position : relative;
width : 100%;
height : auto;
z-index : -1;
overflow : hidden;
margin-bottom : 0;
}
@media screen and (min-width: 1024px) {
.p-user-article .p-user-article-head {
height : 700px;
}
.p-user-article .p-user-article-head img {
position : absolute;
left : 50%;
top : 0;
transform : translateY(0%) translateX(-50%);
}
}
.p-user-article .p-user-article-content {
margin-bottom : 50px;
}
.p-user-article .p-user-article-content h2:not([class]) {
font-size : 24px;
font-size : 2.4rem;
text-align : center;
margin-bottom : 36px;
}
.p-user-article .p-user-article-content h2:not(:first-child) {
margin-top : 96px;
}
.p-user-comment {
max-width : 798px;
background-color : #ffffff;
margin-left : auto;
margin-right : auto;
padding : 42px 15px 202px;
box-sizing : border-box;
}
@media screen and (min-width: 1024px) {
.p-user-comment {
width : 798px;
margin-top : -100px;
padding-left : 80px;
padding-right : 80px;
}
}
.p-user-comment .p-user-comment__inner > *:not([class]):last-child , .p-user-comment .p-user-comment__inner > *:last-child {
margin-bottom : 0;
}
.p-user-single--supportteam .p-user-comment {
padding-bottom : 96px;
}
.p-user-profile {
position : relative;
background-color : rgba(242, 233, 219, 0.25);
padding-left : 15px;
padding-right : 15px;
}
.p-user-profile .p-user-profile__inner {
max-width : 638px;
margin-left : auto;
margin-right : auto;
}
.p-user-profile .p-user-profile__head {
display : flex;
flex-direction : column;
position : relative;
margin-bottom : 25px;
}
@media screen and (min-width: 1024px) {
.p-user-profile .p-user-profile__head {
flex-direction : row;
}
}
@media screen and (min-width: 1024px) {
.p-user-profile .p-user-profile__img {
flex : 0 0 auto;
}
}
.p-user-profile .p-user-profile__caption {
flex : 1 1 auto;
text-align : center;
}
@media screen and (min-width: 1024px) {
.p-user-profile .p-user-profile__caption {
text-align : left;
margin-left : 30px;
}
}
.p-user-profile .p-user-profile__caption > *:not([class]):last-child {
margin-bottom : 0;
}
.p-user-profile .p-user-profile__label {
display : inline-block;
background-color : #25282a;
color : #ffffff;
font-size : 14px;
font-size : 1.4rem;
font-weight : 700;
padding : 0.35rem 1rem;
margin-bottom : 6px;
}
.p-user-profile .p-user-profile__name {
font-size : 22px;
font-size : 2.2rem;
font-weight : 700;
line-height : 1.6;
margin-bottom : 20px;
}
.p-user-profile .p-user-profile__sns {
display : flex;
justify-content : center;
column-gap : 8px;
margin-bottom : 12px;
}
@media screen and (min-width: 1024px) {
.p-user-profile .p-user-profile__sns {
justify-content : flex-start;
}
}
.p-user-profile .p-user-profile__career h3 {
font-weight : 700;
}
.p-user-profile .p-user-profile__career h3:not([class]) {
line-height : 1.6;
}
.p-user-profile .p-user-profile__career p:not([class]) {
line-height : 1.6;
}
.p-user-profile .p-user-profile__career > *:not([class]):last-child {
margin-bottom : 0;
}
.p-user-profile--supportteam {
padding-top : 48px;
padding-bottom : 48px;
}
.p-user-profile--supportteam .p-user-profile__head {
align-items : center;
}
.p-user-profile--supportteam .p-user-profile__img {
max-width : 300px;
}
.p-user-profile--ambassador {
padding-top : 48px;
padding-bottom : 72px;
}
.p-user-profile--ambassador .p-user-profile__head {
align-items : center;
}
@media screen and (min-width: 1024px) {
.p-user-profile--ambassador .p-user-profile__head {
align-items : flex-end;
}
}
.p-user-profile--ambassador .p-user-profile__img {
max-width : 255px;
margin-top : -123px;
margin-bottom : 25px;
}
@media screen and (min-width: 1024px) {
.p-user-profile--ambassador .p-user-profile__img {
margin-bottom : 0;
}
}
.p-user-sns {
margin-bottom : 72px;
padding-right : 15px;
padding-left : 15px;
}
.p-user-sns .c-sns-list {
justify-content : center;
}
.p-user-pagenation {
max-width : 800px;
padding-left : 15px;
padding-right : 15px;
margin-left : auto;
margin-right : auto;
}
/* br - utility - object
--------------------------------------------------------- */
.u-br-sm {
display : inline-block;
}
@media screen and (min-width: 768px) {
.u-br-sm {
display : none;
}
}
@media screen and (min-width: 1024px) {
.u-br-sm {
display : none;
}
}
.u-br-md {
display : none;
}
@media screen and (min-width: 768px) {
.u-br-md {
display : inline-block;
}
}
.u-br-lg {
display : none;
}
@media screen and (min-width: 1024px) {
.u-br-lg {
display : inline-block;
}
}
/* clear - utility - object
--------------------------------------------------------- */
.u-clearfix:after {
display : block;
clear : both;
content : "";
}
/* display- helper
--------------------------------------------------------- */
.u-display-sm {
display : none;
}
@media screen and (min-width: 768px) {
.u-display-sm {
display : inline-block;
}
}
.u-display-md {
display : none;
}
@media screen and (min-width: 1024px) {
.u-display-md {
display : inline-block;
}
}
.u-display-lg {
display : none;
}
@media screen and (min-width: 1280px) {
.u-display-lg {
display : inline-block;
}
}
.u-display-xl {
display : none;
}
@media screen and (min-width: 1280px) {
.u-display-xl {
display : inline-block;
}
}
/* fade- helper
--------------------------------------------------------- */
/* その場で */
.u-fade-in {
animation-name : fadeInAnime;
animation-duration : 1s;
animation-fill-mode : forwards;
opacity : 0;
}
@keyframes fadeInAnime {
from {
opacity : 0;
}
to {
opacity : 1;
}
}
/* 下から */
.u-fade-up {
animation-name : fadeUpAnime;
animation-duration : 0.65s;
animation-fill-mode : forwards;
opacity : 0;
}
@keyframes fadeUpAnime {
from {
opacity : 0;
transform : translateY(80px);
}
to {
opacity : 1;
transform : translateY(0);
}
}
/* 上から */
.u-fade-down {
animation-name : fadeDownAnime;
animation-duration : 0.65s;
animation-fill-mode : forwards;
opacity : 0;
}
@keyframes fadeDownAnime {
from {
opacity : 0;
transform : translateY(-80px);
}
to {
opacity : 1;
transform : translateY(0);
}
}
/* 左から */
.u-fade-left {
animation-name : fadeLeftAnime;
animation-duration : 0.65s;
animation-fill-mode : forwards;
opacity : 0;
}
@keyframes fadeLeftAnime {
from {
opacity : 0;
transform : translateX(-80px);
}
to {
opacity : 1;
transform : translateX(0);
}
}
/* 右から */
.u-fade-right {
animation-name : fadeRightAnime;
animation-duration : 0.65s;
animation-fill-mode : forwards;
opacity : 0;
}
@keyframes fadeRightAnime {
from {
opacity : 0;
transform : translateX(80px);
}
to {
opacity : 1;
transform : translateX(0);
}
}
/* br - utility - object
--------------------------------------------------------- */
.u-br-sm {
display : inline-block;
}
@media screen and (min-width: 768px) {
.u-br-sm {
display : none;
}
}
@media screen and (min-width: 1024px) {
.u-br-sm {
display : none;
}
}
.u-br-md {
display : none;
}
@media screen and (min-width: 768px) {
.u-br-md {
display : inline-block;
}
}
.u-br-lg {
display : none;
}
@media screen and (min-width: 1024px) {
.u-br-lg {
display : inline-block;
}
}
/* font-size - helper
--------------------------------------------------------- */
.u-font-size-1 {
font-size : 1px;
font-size : 0.1rem;
}
.u-font-size-2 {
font-size : 2px;
font-size : 0.2rem;
}
.u-font-size-3 {
font-size : 3px;
font-size : 0.3rem;
}
.u-font-size-4 {
font-size : 4px;
font-size : 0.4rem;
}
.u-font-size-5 {
font-size : 5px;
font-size : 0.5rem;
}
.u-font-size-6 {
font-size : 6px;
font-size : 0.6rem;
}
.u-font-size-7 {
font-size : 7px;
font-size : 0.7rem;
}
.u-font-size-8 {
font-size : 8px;
font-size : 0.8rem;
}
.u-font-size-9 {
font-size : 9px;
font-size : 0.9rem;
}
.u-font-size-10 {
font-size : 10px;
font-size : 1rem;
}
.u-font-size-11 {
font-size : 11px;
font-size : 1.1rem;
}
.u-font-size-12 {
font-size : 12px;
font-size : 1.2rem;
}
.u-font-size-13 {
font-size : 13px;
font-size : 1.3rem;
}
.u-font-size-14 {
font-size : 14px;
font-size : 1.4rem;
}
.u-font-size-15 {
font-size : 15px;
font-size : 1.5rem;
}
.u-font-size-16 {
font-size : 16px;
font-size : 1.6rem;
}
.u-font-size-17 {
font-size : 17px;
font-size : 1.7rem;
}
.u-font-size-18 {
font-size : 18px;
font-size : 1.8rem;
}
.u-font-size-19 {
font-size : 19px;
font-size : 1.9rem;
}
.u-font-size-20 {
font-size : 20px;
font-size : 2rem;
}
.u-font-size-21 {
font-size : 21px;
font-size : 2.1rem;
}
.u-font-size-22 {
font-size : 22px;
font-size : 2.2rem;
}
.u-font-size-23 {
font-size : 23px;
font-size : 2.3rem;
}
.u-font-size-24 {
font-size : 24px;
font-size : 2.4rem;
}
.u-font-size-25 {
font-size : 25px;
font-size : 2.5rem;
}
.u-font-size-26 {
font-size : 26px;
font-size : 2.6rem;
}
.u-font-size-27 {
font-size : 27px;
font-size : 2.7rem;
}
.u-font-size-28 {
font-size : 28px;
font-size : 2.8rem;
}
.u-font-size-29 {
font-size : 29px;
font-size : 2.9rem;
}
.u-font-size-30 {
font-size : 30px;
font-size : 3rem;
}
.u-font-size-31 {
font-size : 31px;
font-size : 3.1rem;
}
.u-font-size-32 {
font-size : 32px;
font-size : 3.2rem;
}
.u-font-size-33 {
font-size : 33px;
font-size : 3.3rem;
}
.u-font-size-34 {
font-size : 34px;
font-size : 3.4rem;
}
.u-font-size-35 {
font-size : 35px;
font-size : 3.5rem;
}
.u-font-size-36 {
font-size : 36px;
font-size : 3.6rem;
}
.u-font-size-37 {
font-size : 37px;
font-size : 3.7rem;
}
.u-font-size-38 {
font-size : 38px;
font-size : 3.8rem;
}
.u-font-size-39 {
font-size : 39px;
font-size : 3.9rem;
}
.u-font-size-40 {
font-size : 40px;
font-size : 4rem;
}
/* font- helper
--------------------------------------------------------- */
.u-font-uniNeue-book {
font-family : "UniNeueBook";
}
.u-font-uniNeue-bold {
font-family : "UniNeueBold";
}
.u-font-uniNeue-regular {
font-family : "UniNeueRegular";
}
.u-font-uniNeue-heavy {
font-family : "UniNeueHeavy";
}
.u-font-color-primary {
color : #ff6a14;
}
/* link- helper
--------------------------------------------------------- */
.u-link-line {
text-decoration : underline;
}
.u-link-line:hover {
text-decoration : none;
}
/* margin - helper
--------------------------------------------------------- */
/* auto margin */
.u-margin-c {
margin-right : auto !important;
margin-left : auto !important;
}
.u-margin-l-auto {
margin-left : auto !important;
}
.u-margin-r-auto {
margin-left : auto !important;
}
/* Top margin */
.u-margin-t-0 {
margin-top : 0 !important;
}
.u-margin-t-2 {
margin-top : 2px !important;
}
.u-margin-t-4 {
margin-top : 4px !important;
}
.u-margin-t-6 {
margin-top : 6px !important;
}
.u-margin-t-8 {
margin-top : 8px !important;
}
.u-margin-t-10 {
margin-top : 10px !important;
}
.u-margin-t-12 {
margin-top : 12px !important;
}
.u-margin-t-14 {
margin-top : 14px !important;
}
.u-margin-t-16 {
margin-top : 16px !important;
}
.u-margin-t-18 {
margin-top : 18px !important;
}
.u-margin-t-20 {
margin-top : 20px !important;
}
.u-margin-t-22 {
margin-top : 22px !important;
}
.u-margin-t-24 {
margin-top : 24px !important;
}
.u-margin-t-26 {
margin-top : 26px !important;
}
.u-margin-t-28 {
margin-top : 28px !important;
}
.u-margin-t-30 {
margin-top : 30px !important;
}
.u-margin-t-32 {
margin-top : 32px !important;
}
.u-margin-t-34 {
margin-top : 34px !important;
}
.u-margin-t-36 {
margin-top : 36px !important;
}
.u-margin-t-38 {
margin-top : 38px !important;
}
.u-margin-t-40 {
margin-top : 40px !important;
}
.u-margin-t-42 {
margin-top : 42px !important;
}
.u-margin-t-44 {
margin-top : 44px !important;
}
.u-margin-t-46 {
margin-top : 46px !important;
}
.u-margin-t-48 {
margin-top : 48px !important;
}
.u-margin-t-50 {
margin-top : 50px !important;
}
.u-margin-t-52 {
margin-top : 52px !important;
}
.u-margin-t-54 {
margin-top : 54px !important;
}
.u-margin-t-56 {
margin-top : 56px !important;
}
.u-margin-t-58 {
margin-top : 58px !important;
}
.u-margin-t-60 {
margin-top : 60px !important;
}
.u-margin-t-62 {
margin-top : 62px !important;
}
.u-margin-t-64 {
margin-top : 64px !important;
}
.u-margin-t-66 {
margin-top : 66px !important;
}
.u-margin-t-68 {
margin-top : 68px !important;
}
.u-margin-t-70 {
margin-top : 70px !important;
}
.u-margin-t-72 {
margin-top : 72px !important;
}
.u-margin-t-74 {
margin-top : 74px !important;
}
.u-margin-t-76 {
margin-top : 76px !important;
}
.u-margin-t-78 {
margin-top : 78px !important;
}
.u-margin-t-80 {
margin-top : 80px !important;
}
.u-margin-t-82 {
margin-top : 82px !important;
}
.u-margin-t-84 {
margin-top : 84px !important;
}
.u-margin-t-86 {
margin-top : 86px !important;
}
.u-margin-t-88 {
margin-top : 88px !important;
}
.u-margin-t-90 {
margin-top : 90px !important;
}
.u-margin-t-92 {
margin-top : 92px !important;
}
.u-margin-t-94 {
margin-top : 94px !important;
}
.u-margin-t-96 {
margin-top : 96px !important;
}
.u-margin-t-98 {
margin-top : 98px !important;
}
.u-margin-t-100 {
margin-top : 100px !important;
}
.u-margin-t-102 {
margin-top : 102px !important;
}
.u-margin-t-104 {
margin-top : 104px !important;
}
.u-margin-t-106 {
margin-top : 106px !important;
}
.u-margin-t-108 {
margin-top : 108px !important;
}
.u-margin-t-110 {
margin-top : 110px !important;
}
.u-margin-t-112 {
margin-top : 112px !important;
}
.u-margin-t-114 {
margin-top : 114px !important;
}
.u-margin-t-116 {
margin-top : 116px !important;
}
.u-margin-t-118 {
margin-top : 118px !important;
}
.u-margin-t-120 {
margin-top : 120px !important;
}
/* Bottom margin */
.u-margin-b-0 {
margin-bottom : 0 !important;
}
.u-margin-b-2 {
margin-bottom : 2px !important;
}
.u-margin-b-4 {
margin-bottom : 4px !important;
}
.u-margin-b-6 {
margin-bottom : 6px !important;
}
.u-margin-b-8 {
margin-bottom : 8px !important;
}
.u-margin-b-10 {
margin-bottom : 10px !important;
}
.u-margin-b-12 {
margin-bottom : 12px !important;
}
.u-margin-b-14 {
margin-bottom : 14px !important;
}
.u-margin-b-16 {
margin-bottom : 16px !important;
}
.u-margin-b-18 {
margin-bottom : 18px !important;
}
.u-margin-b-20 {
margin-bottom : 20px !important;
}
.u-margin-b-22 {
margin-bottom : 22px !important;
}
.u-margin-b-24 {
margin-bottom : 24px !important;
}
.u-margin-b-26 {
margin-bottom : 26px !important;
}
.u-margin-b-28 {
margin-bottom : 28px !important;
}
.u-margin-b-30 {
margin-bottom : 30px !important;
}
.u-margin-b-32 {
margin-bottom : 32px !important;
}
.u-margin-b-34 {
margin-bottom : 34px !important;
}
.u-margin-b-36 {
margin-bottom : 36px !important;
}
.u-margin-b-38 {
margin-bottom : 38px !important;
}
.u-margin-b-40 {
margin-bottom : 40px !important;
}
.u-margin-b-42 {
margin-bottom : 42px !important;
}
.u-margin-b-44 {
margin-bottom : 44px !important;
}
.u-margin-b-46 {
margin-bottom : 46px !important;
}
.u-margin-b-48 {
margin-bottom : 48px !important;
}
.u-margin-b-50 {
margin-bottom : 50px !important;
}
.u-margin-b-52 {
margin-bottom : 52px !important;
}
.u-margin-b-54 {
margin-bottom : 54px !important;
}
.u-margin-b-56 {
margin-bottom : 56px !important;
}
.u-margin-b-58 {
margin-bottom : 58px !important;
}
.u-margin-b-60 {
margin-bottom : 60px !important;
}
.u-margin-b-62 {
margin-bottom : 62px !important;
}
.u-margin-b-64 {
margin-bottom : 64px !important;
}
.u-margin-b-66 {
margin-bottom : 66px !important;
}
.u-margin-b-68 {
margin-bottom : 68px !important;
}
.u-margin-b-70 {
margin-bottom : 70px !important;
}
.u-margin-b-72 {
margin-bottom : 72px !important;
}
.u-margin-b-74 {
margin-bottom : 74px !important;
}
.u-margin-b-76 {
margin-bottom : 76px !important;
}
.u-margin-b-78 {
margin-bottom : 78px !important;
}
.u-margin-b-80 {
margin-bottom : 80px !important;
}
.u-margin-b-82 {
margin-bottom : 82px !important;
}
.u-margin-b-84 {
margin-bottom : 84px !important;
}
.u-margin-b-86 {
margin-bottom : 86px !important;
}
.u-margin-b-88 {
margin-bottom : 88px !important;
}
.u-margin-b-90 {
margin-bottom : 90px !important;
}
.u-margin-b-92 {
margin-bottom : 92px !important;
}
.u-margin-b-94 {
margin-bottom : 94px !important;
}
.u-margin-b-96 {
margin-bottom : 96px !important;
}
.u-margin-b-98 {
margin-bottom : 98px !important;
}
.u-margin-b-100 {
margin-bottom : 100px !important;
}
.u-margin-b-102 {
margin-bottom : 102px !important;
}
.u-margin-b-104 {
margin-bottom : 104px !important;
}
.u-margin-b-106 {
margin-bottom : 106px !important;
}
.u-margin-b-108 {
margin-bottom : 108px !important;
}
.u-margin-b-110 {
margin-bottom : 110px !important;
}
.u-margin-b-112 {
margin-bottom : 112px !important;
}
.u-margin-b-114 {
margin-bottom : 114px !important;
}
.u-margin-b-116 {
margin-bottom : 116px !important;
}
.u-margin-b-118 {
margin-bottom : 118px !important;
}
.u-margin-b-120 {
margin-bottom : 120px !important;
}
/* Right margin */
.u-margin-r-0 {
margin-right : 0 !important;
}
.u-margin-r-2 {
margin-right : 2px !important;
}
.u-margin-r-4 {
margin-right : 4px !important;
}
.u-margin-r-6 {
margin-right : 6px !important;
}
.u-margin-r-8 {
margin-right : 8px !important;
}
.u-margin-r-10 {
margin-right : 10px !important;
}
.u-margin-r-12 {
margin-right : 12px !important;
}
.u-margin-r-14 {
margin-right : 14px !important;
}
.u-margin-r-16 {
margin-right : 16px !important;
}
.u-margin-r-18 {
margin-right : 18px !important;
}
.u-margin-r-20 {
margin-right : 20px !important;
}
.u-margin-r-22 {
margin-right : 22px !important;
}
.u-margin-r-24 {
margin-right : 24px !important;
}
.u-margin-r-26 {
margin-right : 26px !important;
}
.u-margin-r-28 {
margin-right : 28px !important;
}
.u-margin-r-30 {
margin-right : 30px !important;
}
.u-margin-r-32 {
margin-right : 32px !important;
}
.u-margin-r-34 {
margin-right : 34px !important;
}
.u-margin-r-36 {
margin-right : 36px !important;
}
.u-margin-r-38 {
margin-right : 38px !important;
}
.u-margin-r-40 {
margin-right : 40px !important;
}
.u-margin-r-42 {
margin-right : 42px !important;
}
.u-margin-r-44 {
margin-right : 44px !important;
}
.u-margin-r-46 {
margin-right : 46px !important;
}
.u-margin-r-48 {
margin-right : 48px !important;
}
.u-margin-r-50 {
margin-right : 50px !important;
}
.u-margin-r-52 {
margin-right : 52px !important;
}
.u-margin-r-54 {
margin-right : 54px !important;
}
.u-margin-r-56 {
margin-right : 56px !important;
}
.u-margin-r-58 {
margin-right : 58px !important;
}
.u-margin-r-60 {
margin-right : 60px !important;
}
.u-margin-r-62 {
margin-right : 62px !important;
}
.u-margin-r-64 {
margin-right : 64px !important;
}
.u-margin-r-66 {
margin-right : 66px !important;
}
.u-margin-r-68 {
margin-right : 68px !important;
}
.u-margin-r-70 {
margin-right : 70px !important;
}
.u-margin-r-72 {
margin-right : 72px !important;
}
.u-margin-r-74 {
margin-right : 74px !important;
}
.u-margin-r-76 {
margin-right : 76px !important;
}
.u-margin-r-78 {
margin-right : 78px !important;
}
.u-margin-r-80 {
margin-right : 80px !important;
}
.u-margin-r-82 {
margin-right : 82px !important;
}
.u-margin-r-84 {
margin-right : 84px !important;
}
.u-margin-r-86 {
margin-right : 86px !important;
}
.u-margin-r-88 {
margin-right : 88px !important;
}
.u-margin-r-90 {
margin-right : 90px !important;
}
.u-margin-r-92 {
margin-right : 92px !important;
}
.u-margin-r-94 {
margin-right : 94px !important;
}
.u-margin-r-96 {
margin-right : 96px !important;
}
.u-margin-r-98 {
margin-right : 98px !important;
}
.u-margin-r-100 {
margin-right : 100px !important;
}
.u-margin-r-102 {
margin-right : 102px !important;
}
.u-margin-r-104 {
margin-right : 104px !important;
}
.u-margin-r-106 {
margin-right : 106px !important;
}
.u-margin-r-108 {
margin-right : 108px !important;
}
.u-margin-r-110 {
margin-right : 110px !important;
}
.u-margin-r-112 {
margin-right : 112px !important;
}
.u-margin-r-114 {
margin-right : 114px !important;
}
.u-margin-r-116 {
margin-right : 116px !important;
}
.u-margin-r-118 {
margin-right : 118px !important;
}
.u-margin-r-120 {
margin-right : 120px !important;
}
/* Left margin */
.u-margin-l-0 {
margin-left : 0 !important;
}
.u-margin-l-2 {
margin-left : 2px !important;
}
.u-margin-l-4 {
margin-left : 4px !important;
}
.u-margin-l-6 {
margin-left : 6px !important;
}
.u-margin-l-8 {
margin-left : 8px !important;
}
.u-margin-l-10 {
margin-left : 10px !important;
}
.u-margin-l-12 {
margin-left : 12px !important;
}
.u-margin-l-14 {
margin-left : 14px !important;
}
.u-margin-l-16 {
margin-left : 16px !important;
}
.u-margin-l-18 {
margin-left : 18px !important;
}
.u-margin-l-20 {
margin-left : 20px !important;
}
.u-margin-l-22 {
margin-left : 22px !important;
}
.u-margin-l-24 {
margin-left : 24px !important;
}
.u-margin-l-26 {
margin-left : 26px !important;
}
.u-margin-l-28 {
margin-left : 28px !important;
}
.u-margin-l-30 {
margin-left : 30px !important;
}
.u-margin-l-32 {
margin-left : 32px !important;
}
.u-margin-l-34 {
margin-left : 34px !important;
}
.u-margin-l-36 {
margin-left : 36px !important;
}
.u-margin-l-38 {
margin-left : 38px !important;
}
.u-margin-l-40 {
margin-left : 40px !important;
}
.u-margin-l-42 {
margin-left : 42px !important;
}
.u-margin-l-44 {
margin-left : 44px !important;
}
.u-margin-l-46 {
margin-left : 46px !important;
}
.u-margin-l-48 {
margin-left : 48px !important;
}
.u-margin-l-50 {
margin-left : 50px !important;
}
.u-margin-l-52 {
margin-left : 52px !important;
}
.u-margin-l-54 {
margin-left : 54px !important;
}
.u-margin-l-56 {
margin-left : 56px !important;
}
.u-margin-l-58 {
margin-left : 58px !important;
}
.u-margin-l-60 {
margin-left : 60px !important;
}
.u-margin-l-62 {
margin-left : 62px !important;
}
.u-margin-l-64 {
margin-left : 64px !important;
}
.u-margin-l-66 {
margin-left : 66px !important;
}
.u-margin-l-68 {
margin-left : 68px !important;
}
.u-margin-l-70 {
margin-left : 70px !important;
}
.u-margin-l-72 {
margin-left : 72px !important;
}
.u-margin-l-74 {
margin-left : 74px !important;
}
.u-margin-l-76 {
margin-left : 76px !important;
}
.u-margin-l-78 {
margin-left : 78px !important;
}
.u-margin-l-80 {
margin-left : 80px !important;
}
.u-margin-l-82 {
margin-left : 82px !important;
}
.u-margin-l-84 {
margin-left : 84px !important;
}
.u-margin-l-86 {
margin-left : 86px !important;
}
.u-margin-l-88 {
margin-left : 88px !important;
}
.u-margin-l-90 {
margin-left : 90px !important;
}
.u-margin-l-92 {
margin-left : 92px !important;
}
.u-margin-l-94 {
margin-left : 94px !important;
}
.u-margin-l-96 {
margin-left : 96px !important;
}
.u-margin-l-98 {
margin-left : 98px !important;
}
.u-margin-l-100 {
margin-left : 100px !important;
}
.u-margin-l-102 {
margin-left : 102px !important;
}
.u-margin-l-104 {
margin-left : 104px !important;
}
.u-margin-l-106 {
margin-left : 106px !important;
}
.u-margin-l-108 {
margin-left : 108px !important;
}
.u-margin-l-110 {
margin-left : 110px !important;
}
.u-margin-l-112 {
margin-left : 112px !important;
}
.u-margin-l-114 {
margin-left : 114px !important;
}
.u-margin-l-116 {
margin-left : 116px !important;
}
.u-margin-l-118 {
margin-left : 118px !important;
}
.u-margin-l-120 {
margin-left : 120px !important;
}
/* text- helper
--------------------------------------------------------- */
.u-uppercase {
text-transform : uppercase;
}
.u-separator {
display : inline-block;
}
.u-text-bold {
font-weight : 700 !important;
}
.u-text-normal {
font-weight : normal !important;
}
.u-text-center {
text-align : center;
}
.u-text-left {
text-align : left;
}
.u-text-right {
text-align : right;
}
.u-text-notice {
text-indent : -1em;
padding-left : 1em;
line-height : 1.6;
display : inline-block;
font-size : 13px;
font-size : 1.3rem;
}
.u-text-small {
font-size : 14px;
font-size : 1.4rem;
}
/* width - helper
--------------------------------------------------------- */
.u-width-100 {
width : 100%;
}
.video {
width: 100%;
position: relative;
padding-top: 56.25%;
}
.video iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/* =========================================
Footer SNS icons layout (VENEX)
SP:3列×2段(中央)
中間:6個横並び(中央)
PC:3列×2段(右寄せ)
========================================= */
.l-footer-sns-list {
flex-wrap: wrap;
align-content: flex-start;
row-gap: 12px;
margin-left: auto;
margin-right: auto;
}
.l-footer-sns-list__item { line-height: 1; }
.l-footer-sns-list__item > a { display: inline-flex; }
/* SP:3列×2段(中央) */
@media screen and (max-width: 767px) {
.l-footer-sns-list {
/* 3列固定:32×3 + 16×2 = 128 */
max-width: calc(32px * 3 + 16px * 2);
}
}
/* 中間:6個横並び(中央) */
@media screen and (min-width: 768px) and (max-width: 1023px) {
.l-footer-sns-list {
flex-wrap: nowrap; /* 1列固定 */
row-gap: 0;
/* 6個固定:32×6 + 16×5 = 272 */
max-width: calc(32px * 6 + 16px * 5);
}
}
/* PC:3列×2段(右寄せ) */
@media screen and (min-width: 1024px) {
.l-footer-sns-list {
flex-wrap: wrap;
row-gap: 12px;
/* 3列固定 */
max-width: calc(32px * 3 + 16px * 2);
/* 右寄せに戻す */
margin-left: auto;
margin-right: 0;
justify-content: flex-end;
}
}