#page_products #sec_products .acd, #page_products #sec_products .link,
#page_products_wc #sec_products .acd,
#page_products_wc #sec_products .link {
border-bottom: 1px solid #aaa;
font-size: 2rem;
line-height: 1.4;
font-weight: 500;
position: relative;
padding: 0.5em 1em;
margin-top: 3rem;
}
#page_products #sec_products .acd,
#page_products_wc #sec_products .acd {
padding-left: 3em;
cursor: pointer;
}
#page_products #sec_products .acd .ico,
#page_products_wc #sec_products .acd .ico {
position: absolute;
left: 1em;
top: 50%;
translate: 0 -50%;
width: 1em;
height: 1em;
}
#page_products #sec_products .acd .ico::before, #page_products #sec_products .acd .ico::after,
#page_products_wc #sec_products .acd .ico::before,
#page_products_wc #sec_products .acd .ico::after {
content: "";
position: absolute;
left: 50%;
top: 50%;
translate: -50% -50%;
width: 100%;
height: 2px;
background: #222;
transition: rotate 0.3s ease;
}
#page_products #sec_products .acd .ico::after,
#page_products_wc #sec_products .acd .ico::after {
rotate: 90deg;
}
#page_products #sec_products .acd.is-open .ico::after,
#page_products_wc #sec_products .acd.is-open .ico::after {
rotate: 180deg;
}
#page_products #sec_products .link a,
#page_products_wc #sec_products .link a {
padding-left: 2em;
}
#page_products #sec_products .link a::before,
#page_products_wc #sec_products .link a::before {
content: "";
position: absolute;
left: 1em;
top: 50%;
translate: 0 -50%;
width: 0.6em;
height: 0.6em;
border-top: 2px solid #000;
border-right: 2px solid #000;
rotate: 45deg;
}
#page_products #sec_products .link a[target=_blank]::before,
#page_products_wc #sec_products .link a[target=_blank]::before {
background: url(//exgel.jp/jpn/wp-content/themes/exgel/assets/img/common/ico_blank.svg) no-repeat center/contain;
border: none;
rotate: 0deg;
width: 1em;
height: 1em;
}
#page_products #sec_products .acd_item,
#page_products_wc #sec_products .acd_item {
padding-bottom: 12rem;
}
@media screen and (max-width: 767px) {
#page_products #sec_products .acd_item,
#page_products_wc #sec_products .acd_item {
padding-bottom: 6rem;
}
}
#page_products #sec_products .item,
#page_products_wc #sec_products .item {
margin-top: 6rem;
}
@media screen and (max-width: 767px) {
#page_products #sec_products .item,
#page_products_wc #sec_products .item {
margin-top: 4rem;
}
}
#page_products #sec_products .item .img img,
#page_products_wc #sec_products .item .img img {
width: 100%;
}
#page_products #sec_products .item .img + .category,
#page_products_wc #sec_products .item .img + .category {
margin-top: 1rem;
}
#page_products #sec_products .item .slider,
#page_products_wc #sec_products .item .slider {
width: 66rem;
}
@media screen and (max-width: 767px) {
#page_products #sec_products .item .slider,
#page_products_wc #sec_products .item .slider {
width: 100%;
}
}
#page_products #sec_products .item .slider .img,
#page_products_wc #sec_products .item .slider .img {
aspect-ratio: 1.7647058824;
overflow: hidden;
}
#page_products #sec_products .item .slider .img img,
#page_products_wc #sec_products .item .slider .img img {
width: 100%;
height: 100%;
object-fit: cover;
}
#page_products #sec_products .item .slider .slick-arrow,
#page_products_wc #sec_products .item .slider .slick-arrow {
margin-top: -1.5rem;
}
#page_products #sec_products .item .slider .slick-dots,
#page_products_wc #sec_products .item .slider .slick-dots {
padding: 0;
}
#page_products #sec_products .item .category,
#page_products_wc #sec_products .item .category {
color: #5F5F5F;
font-size: 1.4rem;
}
#page_products #sec_products .item .logo,
#page_products_wc #sec_products .item .logo {
font-size: 1.8rem;
line-height: 1.4;
font-weight: 500;
margin: 1rem 0;
}
@media screen and (max-width: 767px) {
#page_products #sec_products .item .logo,
#page_products_wc #sec_products .item .logo {
font-size: 2.2rem;
}
}
#page_products #sec_products .item .logo img,
#page_products_wc #sec_products .item .logo img {
height: 7rem;
}
#page_products #sec_products .item .logo._row2 img,
#page_products_wc #sec_products .item .logo._row2 img {
height: 10rem;
}
#page_products #sec_products .item .catch,
#page_products_wc #sec_products .item .catch {
font-weight: 500;
margin: 1em 0;
}
@media screen and (max-width: 767px) {
#page_products #sec_products .item .catch,
#page_products_wc #sec_products .item .catch {
font-size: 1.8rem;
}
}
#page_products #sec_products .item .txt,
#page_products_wc #sec_products .item .txt {
color: #5F5F5F;
font-size: 1.4rem;
}
@media screen and (max-width: 767px) {
#page_products #sec_products .item .txt,
#page_products_wc #sec_products .item .txt {
font-size: 1.6rem;
}
}
#page_products #sec_products .item .btn,
#page_products_wc #sec_products .item .btn {
margin-top: 2rem;
}
#page_products #sec_products .item .btn a,
#page_products_wc #sec_products .item .btn a {
font-size: 1.4rem;
}
@media screen and (max-width: 767px) {
#page_products #sec_products .item .btn a,
#page_products_wc #sec_products .item .btn a {
font-size: 1.8rem;
}
}
#page_products #sec_products .item._medium .catch, #page_products #sec_products .item._small .catch,
#page_products_wc #sec_products .item._medium .catch,
#page_products_wc #sec_products .item._small .catch {
margin-bottom: 0.5em;
}
#page_products_wc #sec_products .link {
padding-left: 3em;
}
#page_products_wc #sec_products .link::before {
content: "";
position: absolute;
left: 1em;
top: 50%;
translate: 0 -50%;
width: 0.6em;
height: 0.6em;
border-bottom: 2px solid #000;
border-right: 2px solid #000;
rotate: 45deg;
} #page_products_story #sec_fv .img img {
width: 100%;
}
#page_products_story #sec_fv .inner {
padding: 10rem 0;
}
@media screen and (max-width: 767px) {
#page_products_story #sec_fv .inner {
padding: 6rem 0 2rem;
}
}
#page_products_story #sec_fv .inner .txt + .txt {
margin-top: 2em;
}
#page_products_story #sec_story .box {
margin-top: 10rem;
align-items: center;
}
@media screen and (max-width: 767px) {
#page_products_story #sec_story .box {
margin-top: 6rem;
}
#page_products_story #sec_story .box .c-ml10,
#page_products_story #sec_story .box .c-mr10 {
margin: 0;
}
#page_products_story #sec_story .box .c-ml0 {
margin-right: -5vw;
}
}
#page_products_story #sec_story .box .txt + .txt {
margin-top: 2em;
}
@media screen and (max-width: 767px) {
#page_products_story #sec_story .box .flex {
justify-content: center;
}
}
#page_products_story #sec_story .box .flex .arrow {
flex: 0 0 auto;
position: relative;
}
#page_products_story #sec_story .box .flex .arrow:before {
content: "";
position: absolute;
left: 50%;
top: 50%;
translate: -80% -50%;
margin-top: -4rem;
width: 1.5rem;
height: 1.5rem;
border-top: 2px solid #000;
border-right: 2px solid #000;
rotate: 45deg;
}
@media screen and (max-width: 767px) {
#page_products_story #sec_story .box .flex .arrow:before {
rotate: 135deg;
top: 2rem;
width: 2rem;
height: 2rem;
}
} @media screen and (min-width: 768px) {
.p-feature .c-imgCol_t {
flex: 0 1 35%;
min-width: 0;
}
.p-feature .c-imgCol_i {
flex: 1 1 0;
min-width: 0;
overflow: hidden;
}
.p-feature .c-imgCol_i img {
width: 100%;
height: auto;
display: block;
}
} @media screen and (min-width: 768px) {
#sec_story .c-imgCol_t {
flex: 0 1 35%;
min-width: 0;
}
#sec_story .c-imgCol_i {
flex: 0 1 65%;
min-width: 0;
}
}