img {
max-width: 100%;
height: auto;
vertical-align: bottom;
image-rendering: -webkit-optimize-contrast;
}
header > .flexBlock {
border-bottom: none;
}
footer {
border-top: none;
}
/* nav */
.lb .closeBtn, .menu-trigger {
width: 70px;
height: 70px;
padding: 20px 15px 15px;
position: fixed;
top: 0;
right: 0;
z-index: 99;
}
.lb .closeBtn .rel, .menu-trigger .rel {
width: 100%;
height: 14px;
}
.lb .closeBtn .rel span, .menu-trigger .rel span {
height: 2px;
background: #e60012 !important;
left: 0;
width: 100%;
transform-origin: center center;
}
.menu-trigger .rel span:nth-child(1) {
top: 0;
transform: rotate(360deg);
}
.menu-trigger .rel span:nth-child(2) {
bottom: 0;
transform: rotate(-360deg);
}
.lb .closeBtn .rel span:nth-child(1), header.open + * .menu-trigger .rel span:nth-child(1) {
top: calc(50% - 1px);
transform: rotate(25deg);
}
.lb .closeBtn .rel span:nth-child(2), header.open + * .menu-trigger .rel span:nth-child(2) {
bottom: calc(50% - 1px);
transform: rotate(-25deg);
}
.lb .closeBtn p, .menu-trigger p {
color: #e60012 !important;
font-size: 12px;
text-align: center;
line-height: 1;
bottom: 10px;
left: 0;
width: 100%;
height: 12px;
}
.lb .closeBtn p span, .menu-trigger p span {
width: 100%;
}
.menu-trigger p span:nth-child(1) {
opacity: 1;
}
.menu-trigger p span:nth-child(2) {
opacity: 0;
}
header.open + * .menu-trigger p span:nth-child(2) {
opacity: 1;
}
header.open + * .menu-trigger p span:nth-child(1) {
opacity: 0;
}
nav {
position: fixed;
top: 70px;
right: 0;
background: rgba(0, 0, 0, 0.9);
height: calc(100vh - 70px);
width: 100%;
max-width: 450px;
padding: 0 50px;
text-align: left;
overflow-x: hidden;
overflow-y: auto;
transform: translateX(100%);
opacity: 0;
}
header.open + * nav {
transform: translate(0);
opacity: 1;
z-index: 99;
}
nav ul {
width: 100%;
height: auto;
padding: 30px 0 30px;
}
nav li .en {
font-size: 3.0rem;
font-weight: 600;
color: #e60012 !important;
display: block;
line-height: 1;
margin-bottom: 3px;
}
nav li .jp {
font-size: 1.8rem;
color: #FFFFFF;
display: block;
}
nav li {
margin-bottom: 25px;
}
nav li:last-child {
margin-bottom: 0;
}
.lb .closeBtn, .menu-trigger {
cursor: pointer;
}
nav li {
margin-bottom: 30px;
}
nav li .en, .abs {
font-family: 'Orbitron', sans-serif;
}
nav li .en {
font-weight: 500;
letter-spacing: .05em;
}
nav li .jp {
font-size: 20px;
font-size: 2.0rem;
line-height: 1.5;
letter-spacing: .05em;
}
@media all and (max-width: 767px) {
header > .flexBlock > p {
width: 182px;
}
/* nav */
.lb .closeBtn, .menu-trigger {
width: 50px;
height: 50px;
padding: 12px 10px 5px;
}
.lb .closeBtn p, .menu-trigger p {
font-size: 10px;
}
nav {
top: 50px;
height: calc(100vh - 50px);
padding: 0 40px;
}
nav li .en {
font-size: 25px;
font-size: 2.5rem;
}
nav li .jp {
font-size: 15px;
font-size: 1.5rem;
}
}
/* CSS Document */
/* responsive
------------------------------------------------------------ */
.pc-none {
display: none !important;
}
@media screen and (max-width: 1023px) {
.pc-none {
display: block !important;
}
.sp-none {
display: none !important;
}
}
/* section
------------------------------------------------------------ */
.t-collabo__section {
display: flex;
flex-direction: column;
justify-content: center;
position: relative;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
.t-collabo__container {
display: flex;
flex-direction: column;
width: 100%;
max-width: 1200px;
padding-top: 50px;
padding-bottom: 50px;
margin-right: auto;
margin-left: auto;
}
#campaign .t-collabo__container {
max-width: 1100px;
}
@media screen and (max-width: 1240px) {
.t-collabo__section {
padding-right: 15px;
padding-left: 15px;
}
}
@media screen and (max-width: 767px) {
.t-collabo__container {
padding-top: 45px;
padding-bottom: 60px;
align-items: center;
}
}
/* heading
------------------------------------------------------------ */
.t-collabo__heading {
padding-bottom: 45px;
position: relative;
text-align: center;
font-size: 54px;
font-size: 5.4rem;
line-height: 1.131;
letter-spacing: .025em;
}
.t-collabo__heading-left {
position: absolute;
top: 50%;
left: 30px;
transform: rotate(90deg) translateX(-65%);
transform-origin: left bottom;
}
.t-collabo__heading-ja {
margin-top: 20px;
text-align: center;
font-size: 30px;
font-size: 3.0rem;
font-weight: 700;
letter-spacing: .039em;
color: #ffffff;
}
@media screen and (max-width: 1023px) {
.t-collabo__heading-left {
position: relative;
top: 0;
left: 0;
transform: none;
}
}
@media screen and (max-width: 767px) {
.t-collabo__heading {
font-size: 38px;
font-size: 3.8rem;
}
.t-collabo__heading-ja {
margin-top: 25px;
font-size: 20px;
font-size: 2.0rem;
line-height: 1.5;
}
}
/* text
------------------------------------------------------------ */
.t-collabo__text {
color: #333333;
font-size: 16px;
font-size: 1.6rem;
line-height: 1.75;
letter-spacing: .025em;
word-break: break-word;
}
@media screen and (max-width: 767px) {
.t-collabo__text {
font-size: 11px;
font-size: 1.1rem;
}
}
/* features
------------------------------------------------------------ */
.t-collabo-features__container {
position: relative;
}
.t-collabo-features__container::before {
content: attr(data-num);
height: 1em;
position: absolute;
bottom: 40px;
z-index: 2;
color: transparent;
font-size: 120px;
font-size: 12rem;
line-height: 1;
letter-spacing: .025em;
}
.t-collabo-features__container.is-left::before {
left: 0;
}
.t-collabo-features__container.is-right::before {
right: 0;
}
/* filter */
.t-collabo-filter__images {
display: flex;
align-items: flex-end;
margin-bottom: -50px;
}
.t-collabo-filter__images-item {
width: 50%;
position: relative;
}
.t-collabo-filter__images-item img {
width: 100%;
}
.t-collabo-filter__images-name {
position: absolute;
font-size: 12px;
font-size: 1.2rem;
letter-spacing: .025em;
white-space: nowrap;
transform: translateY(-50%);
}
.t-collabo-filter__images-name::before {
content: "";
display: block;
width: 24px;
height: 3px;
background-image: linear-gradient(-90deg, #e60012 50%, transparent 50%);
background-size: 6px 6px;
position: absolute;
top: 50%;
transform: skewX(50deg) translateY(-50%);
}
.t-collabo-filter__image01-name {
top: 39%;
left: 76.666%;
}
.t-collabo-filter__image01-name::before {
left: -30px;
}
.t-collabo-filter__image02-name {
top: 53%;
right: 80%;
}
.t-collabo-filter__image02-name::before {
right: -30px;
}
@media screen and (max-width: 1023px) {
.t-collabo-filter__images {
flex-direction: column;
margin-top: 25px;
}
.t-collabo-filter__images-item {
width: calc(100% + 20px);
margin-right: -10px;
margin-left: -10px;
}
.t-collabo-filter__images-item:not(:last-child) {
margin-bottom: 20px;
}
.t-collabo-filter__images-name {
position: static;
transform: translateY(0);
text-align: center;
}
.t-collabo-filter__images-name::before {
display: none;
}
}
/* gallery
------------------------------------------------------------ */
.t-collabo-gallery {
padding-top: 80px;
background: linear-gradient(45deg, #2e2e2e, #000);
}
.t-collabo-gallery__group {
display: flex;
flex-wrap: wrap;
margin: 50px -2.5px 2.5px;
}
.t-collabo-gallery__group-item {
width: 20%;
padding: 2.5px;
}
.t-collabo-gallery__group-item img {
width: 100%;
}
@media screen and (max-width: 1023px) {
.t-collabo-gallery__group-item {
width: 33%;
}
}
@media screen and (max-width: 767px) {
.t-collabo-gallery {
padding-top: 50px;
}
.t-collabo-gallery__group-item {
width: 50%;
padding: 1.5px;
}
.t-collabo-gallery__group {
margin: 45px -21.5px -1.5px;
}
}
/* SPECIAL
------------------------------------------------------------ */
.t-collabo-special__contents {
display: flex;
padding: 0 45px 55px;
position: relative;
margin-top: 100px;
margin-bottom: -50px;
}
.t-collabo-special__input {
display: none;
}
.t-collabo-special__contents-wrap {
max-width: 345px;
position: relative;
z-index: 2;
margin-right: auto;
}
.t-collabo-special__contents-heading {
margin-bottom: 15px;
text-align: left;
line-height: 1.6;
}
.t-collabo-special__tabs {
margin-top: 40px;
}
.t-collabo-special__tabs-item:not(:last-child) {
margin-bottom: 20px;
}
.t-collabo-special__tabs-label {
padding-left: 35px;
position: relative;
color: #FFF;
font-size: 16px;
font-size: 1.6rem;
font-weight: 500;
line-height: 1;
letter-spacing: .025em;
cursor: pointer;
transition: .3s;
}
.t-collabo-special__tabs-label::before, .t-collabo-special__tabs-label::after {
content: "";
display: block;
border-radius: 50%;
position: absolute;
transition: .3s;
}
.t-collabo-special__tabs-label::before {
width: 20px;
height: 20px;
border: 1px solid #c4c4c4;
top: -2px;
left: 0;
}
.t-collabo-special__tabs-label::after {
width: 14px;
height: 14px;
background-color: #FFF;
top: 1px;
left: 3px;
opacity: 0;
}
.t-collabo-special__slides-wrap {
width: 1273px;
position: absolute;
bottom: 0;
right: 365px;
z-index: 1;
}
.t-collabo-special__slides {
width: 100%;
padding-bottom: 47.368%;
position: relative;
margin-bottom: 0;
}
.t-collabo-special__slides-item {
width: 100%;
position: absolute;
top: 0;
left: 0;
opacity: 0;
transition: .3s;
}
.t-collabo-special__slides-item img {
width: 100%;
}
.t-collabo-special__color {
max-width: 315px;
position: relative;
z-index: 2;
}
.t-collabo-special__color-image {
margin-bottom: 15px;
}
.t-collabo-special__color-dl dt {
color: #e60012;
font-size: 11px;
font-size: 1.1rem;
letter-spacing: .025em;
}
.t-collabo-special__color-dl dt span {
display: block;
position: relative;
font-size: 16px;
font-size: 1.6rem;
}
.t-collabo-special__color-dl dt span::before {
content: "";
display: block;
width: 24px;
height: 3px;
background-image: linear-gradient(-90deg, #e60012 50%, transparent 50%);
background-size: 6px 6px;
position: absolute;
top: 50%;
left: -35px;
transform: skewX(50deg) translateY(-50%);
}
.t-collabo-special__note {
margin-top: 25px;
font-size: 12px;
font-size: 1.2rem;
line-height: 2;
letter-spacing: .039em;
color: #333333;
}
@media screen and (max-width: 1023px) {
.t-collabo-special__container {
padding-bottom: 60px;
}
.t-collabo-special__contents {
flex-direction: column;
padding: 0;
margin-bottom: 0;
}
.t-collabo-special__contents-wrap {
max-width: 100%;
margin-left: auto;
}
.t-collabo-special__tabs {
display: flex;
justify-content: center;
width: calc(100% + 40px);
padding-top: calc(100% + 40px + 25px);
margin: 0;
position: absolute;
top: 100%;
left: -20px;
}
.t-collabo-special__tabs-item {
padding: 0 25px;
}
.t-collabo-special__tabs-item:not(:last-child) {
margin-bottom: 0;
}
.t-collabo-special__slides-wrap {
width: auto;
position: static;
margin: 0 -20px 100px;
}
.t-collabo-special__slides {
padding-bottom: 100%;
}
.t-collabo-special__color {
max-width: 100%;
margin: 0 auto;
text-align: left;
}
.t-collabo-special__color-image {
text-align: center;
}
.t-collabo-special__color-dl dt span::before {
display: none;
}
}
@media screen and (max-width: 767px) {
.t-collabo-special__contents {
margin-top: 40px;
}
.t-collabo-special__color-dl dt, .t-collabo-special__color-dl dd {
font-size: 10px;
font-size: 1.0rem;
}
.t-collabo-special__color-dl dt span {
font-size: 12px;
font-size: 1.2rem;
}
.t-collabo-special__tabs {
width: calc(100% + 50px);
left: -25px;
}
.t-collabo-special__tabs-item {
padding: 0 25px;
}
.t-collabo-special__tabs-label {
padding-left: 20px;
font-size: 11px;
font-size: 1.1rem;
}
.t-collabo-special__tabs-label::before {
width: 15px;
height: 15px;
top: -3px;
}
.t-collabo-special__tabs-label::after {
width: 11px;
height: 11px;
top: -1px;
left: 2px;
}
}
/* sub */
.t-collabo-special-sub {
background-size: cover;
background-position: center;
}
.t-collabo-special-sub__container {
padding: 100px 0 120px;
max-width: 1100px;
}
.t-collabo-special-sub__section {
display: flex;
align-items: center;
margin: 0 -40px;
}
.t-collabo-special-sub__section:not(:last-child) {
/*margin-bottom: 120px;*/
}
.t-collabo-special-sub__section:nth-child(2n-1) {
flex-direction: row-reverse;
}
.t-collabo-special-sub__section:nth-child(2n) {
flex-direction: row;
}
.t-collabo-special-sub__section .t-collabo__sub-heading {
margin-right: -1em;
}
.t-collabo-special-sub__contents, .t-collabo-special-sub__image {
width: 50%;
padding: 0 40px;
}
.t-collabo-special-sub__image {
text-align: center;
}
.t-collabo-special-sub__section:nth-child(2n) .t-collabo-special-sub__contents {
padding-left: 120px;
}
.t-collabo-special-sub__section:nth-child(2n-1) .t-collabo-special-sub__image {
margin-right: auto;
}
.t-collabo-special-sub__section:nth-child(2n) .t-collabo-special-sub__image {
margin-left: auto;
}
.t-collabo-special-sub__image-item:not(:last-child) {
margin-bottom: 10px;
}
.t-collabo-special-sub__text {
max-width: 420px;
}
.t-collabo-special-sub__text-note {
margin-top: 40px;
}
@media screen and (max-width: 1023px) {
.t-collabo-special-sub__section {
flex-wrap: wrap;
padding: 0 !important;
}
#special .t-collabo-special-sub__section:not(:last-child) {
margin-bottom: 60px;
}
.t-collabo-special-sub__contents, .t-collabo-special-sub__image {
width: 100%;
padding: 0 40px;
text-align: center;
}
.t-collabo-special-sub__section:nth-child(2n) .t-collabo-special-sub__contents {
padding-left: 40px;
}
.t-collabo-special-sub__section .t-collabo__sub-heading {
margin-right: 0;
}
.t-collabo-special-sub__text {
max-width: 100%;
}
.t-collabo-special-sub__image {
margin-top: 25px;
box-sizing: content-box;
}
.t-collabo-special-sub__text-note {
margin-top: 10px;
}
}
@media screen and (max-width: 767px) {
.t-collabo-special-sub__container {
padding: 40px 0px;
}
.t-collabo-special-sub__text, .t-collabo-special-sub__note {
text-align: left;
}
.t-collabo-special-sub__image {
margin-right: auto;
margin-left: auto;
}
.t-collabo-special-sub__image01 {
max-width: 250px;
}
.t-collabo-special-sub__image02 {
max-width: 255px;
}
.t-collabo-special-sub__image03 {
max-width: 230px;
}
}
/* CAMPAIGN
------------------------------------------------------------ */
.t-collabo-campaign__container {
padding: 100px 0 120px;
}
.t-collabo-campaign__frame {
display: flex;
align-items: center;
/*padding: 45px;*/
background-color: rgba(0, 0, 0, .7);
/*border: 1px solid #e60012;*/
/*margin-top: 45px;*/
}
.t-collabo-campaign__frame-contents {
flex-shrink: 0;
width: 550px;
margin-right: auto;
}
.t-collabo-campaign__text {
max-width: 460px;
margin-top: 30px;
}
.t-collabo-campaign__period {
margin-top: 25px;
}
.t-collabo-campaign__period-frame {
display: inline-block;
padding: .5em 2em;
border: 1px solid #333333;
border-radius: 3em;
color: #333333;
font-size: 14px;
font-size: 1.4rem;
font-weight: 500;
letter-spacing: .025em;
}
.t-collabo-campaign__link {
margin-top: 90px;
}
.t-collabo-campaign__link a {
display: inline-block;
}
.t-collabo-compaign__btn-wrap {
margin-top: 35px;
}
@media screen and (max-width: 1240px) {
.t-collabo-campaign__frame-image {
width: 400px;
max-width: 100%;
}
}
@media screen and (max-width: 1023px) {
.t-collabo-campaign__frame {
flex-direction: column-reverse;
}
.t-collabo-campaign__frame-contents {
width: 100%;
margin-top: 15px;
text-align: center;
}
.t-collabo-campaign__text {
max-width: 100%;
margin-top: 15px;
}
}
@media screen and (max-width: 767px) {
.t-collabo-campaign__container {
padding: 40px 0 65px;
}
.t-collabo-campaign__frame {
padding: 15px 0px 45px;
}
.t-collabo-campaign__period-frame {
width: 100%;
font-size: 10px;
font-size: 1.0rem;
}
.t-collabo-campaign__link {
margin-top: 30px;
}
}
/* lineup
------------------------------------------------------------ */
.t-collabo-lineup__section-heading-area {
padding: 60px 0 50px;
}
.t-collabo-lineup__list {
background-color: #FFF;
}
.t-collabo-lineup__list .rel {
width: 100%;
margin-right: auto;
margin-left: auto;
}
@media screen and (max-width: 767px) {
.t-collabo-lineup__section-heading-area {
padding: 45px 0 60px;
}
.t-collabo-lineup__list .rel {
padding: 20px 0;
}
}
/* ABOUT
------------------------------------------------------------ */
.t-collabo-about__contents {
display: flex;
align-items: center;
padding-left: 115px;
}
.t-collabo-about__contents-left {
max-width: 440px;
}
.t-collabo-about__contents-right {
margin-left: auto;
}
.t-collabo-about__sub-heading {
margin-top: 0;
margin-bottom: 30px;
text-align: left;
color :#c80000
}
.t-collabo-about__logo {
text-align: center;
/* margin-bottom: 180px;*/
}
.t-collabo-about__link-group-item:not(:last-child) {
margin-bottom: 20px;
}
.t-collabo-about__link {
display: block;
width: 380px;
max-width: 100%;
padding: 10px 45px 10px 35px;
background-color: rgba(105, 255, 216, .2);
border: 1px solid #e60012;
position: relative;
margin: auto;
color: #FFF;
font-size: 18px;
font-size: 1.8rem;
font-weight: 700;
letter-spacing: .025em;
text-shadow: 0 0 10px rgba(75, 234, 208, .8), 0 0 10px rgba(75, 234, 208, .8);
transition: .3s;
}
.t-collabo-about__link img {
position: absolute;
top: 0;
right: 25px;
bottom: 0;
margin: auto;
}
.t-collabo-about__link:hover {
background-color: rgba(105, 255, 216, .6);
}
@media screen and (max-width: 1240px) {
.t-collabo-about__contents {
padding: 0 40px;
}
}
@media screen and (max-width: 1023px) {
.t-collabo-about__contents {
flex-direction: column;
padding: 0;
}
.t-collabo-about__sub-heading {
text-align: center;
}
.t-collabo-about__contents-right {
width: 100%;
margin-top: 55px;
margin-right: auto;
}
}
@media screen and (max-width: 767px) {
.t-collabo-about__logo {
margin-bottom: 55px;
}
.t-collabo-about__logo img {
/* width: 225px;*/
}
.t-collabo-about__link-group-item:not(:last-child) {
margin-bottom: 15px;
}
.t-collabo-about__link {
width: 100%;
font-size: 12px;
font-size: 1.2rem;
}
.t-collabo-about__link img {
width: 6px;
right: 17px;
}
}
/* MEMBER
------------------------------------------------------------ */
.t-collabo-member__container {
padding: 120px 0 160px;
}
.t-collabo-member__list {
width: 100%;
max-width: 1230px;
margin: 80px auto 0;
}
.t-collabo-member-section:not(:last-child) {
margin-bottom: 90px;
}
.t-collabo-member-section__heading {
margin-bottom: 40px;
text-align: center;
color: #e60012;
font-size: 24px;
font-size: 2.4rem;
font-weight: 500;
letter-spacing: .025em;
}
.t-collabo-member-section__group {
display: flex;
flex-wrap: wrap;
margin: -30px -5px;
}
.t-collabo-member-section__group-item {
width: 20%;
padding: 30px 5px;
}
.t-collabo-member-section__card {
cursor: pointer;
}
.t-collabo-member-section__thumb {
transform: skewY(-8deg);
overflow: hidden;
}
.t-collabo-member-section__thumb-profile {
content: "PROFILE";
display: block;
width: 85px;
padding: 5px 5px 5px 15px;
background-color: #e60012;
position: relative;
color: #000;
font-size: 12px;
font-size: 1.2rem;
font-weight: 500;
line-height: 1;
letter-spacing: .025em;
}
.t-collabo-member-section__thumb-profile::before, .t-collabo-member-section__thumb-profile::after {
content: "";
display: block;
height: 100%;
position: absolute;
bottom: 0;
}
.t-collabo-member-section__thumb-profile::before {
border-bottom: 22px solid #e60012;
border-right: 17px solid transparent;
left: 100%;
}
.t-collabo-member-section__thumb-profile::after {
width: 32px;
background-image: linear-gradient(-90deg, #e60012 50%, transparent 50%);
background-size: 16px;
left: calc(100% + 17px);
transform: skewX(37deg);
transform-origin: left bottom;
}
.t-collabo-member-section__thumb-inner {
border: 2px solid #e60012;
background-color: #FFF;
overflow: hidden;
}
.t-collabo-member-section__thumb-inner img {
display: block;
width: 100%;
margin: -8% 0;
transform: skewY(8deg);
/*filter: grayscale(1);*/
transition: .3s;
}
.t-collabo-member-section__card:hover .t-collabo-member-section__thumb-inner img {
filter: grayscale(0);
}
.t-collabo-member-section__name {
margin-top: 25px;
text-align: center;
color: #e60012;
font-size: 12px;
font-size: 1.2rem;
font-weight: 500;
line-height: 1;
letter-spacing: .025em;
}
.t-collabo-member-section__name::before {
content: attr(data-eng);
display: block;
margin-bottom: 10px;
font-size: 24px;
font-size: 2.4rem;
}
.t-collabo-member-section__text {
display: none;
}
/* lb */
body.is-lb-open {
overflow: hidden;
}
.t-collabo-member-lb {
display: none;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, .9);
position: fixed;
top: 0;
left: 0;
z-index: 1050;
}
.t-collabo-member-lb.is-show {
overflow-x: hidden;
overflow-y: auto;
}
.t-collabo-member-lb__dialog {
display: flex;
align-items: center;
max-width: 1040px;
padding: 0 50px;
min-height: calc(100% - (20px * 2));
margin: 20px auto;
pointer-events: none;
}
@media all and (-ms-high-contrast:none) {
.t-collabo-member-lb__dialog {
height: calc(100% - (20px * 2));
}
}
.t-collabo-member-lb__content {
width: 100%;
min-height: 480px;
padding: 40px 50px 25px;
background-color: #FFF;
position: relative;
margin-right: auto;
margin-left: auto;
transform: skewY(-8deg);
pointer-events: auto;
}
.t-collabo-member-lb__content-inner {
display: flex;
transform: skewY(8deg);
}
.t-collabo-member-lb__thumb {
flex-shrink: 0;
align-self: flex-start;
width: 285px;
background-color: #FFF;
border: 4px solid #e60012;
box-shadow: 20px 20px 0 #e60012;
margin: -50px 0 -40px;
transform: skewY(-8deg);
overflow: hidden;
}
.t-collabo-member-lb__thumb img {
margin: -8% 0;
transform: skewY(8deg);
}
.t-collabo-member-lb__content-box {
display: flex;
flex-direction: column;
width: 100%;
padding-bottom: 40px;
margin-left: 90px;
}
.t-collabo-member-lb__dept {
margin-bottom: 20px;
color: #e60012;
font-size: 16px;
font-size: 1.6rem;
font-weight: 500;
letter-spacing: .025em;
}
.t-collabo-member-lb__name {
margin-bottom: 25px;
color: #e60012;
font-size: 12px;
font-size: 1.2rem;
font-weight: 500;
line-height: 1;
letter-spacing: .025em;
}
.t-collabo-member-lb__name::before {
content: attr(data-eng);
display: block;
margin-bottom: 15px;
font-size: 32px;
font-size: 3.2rem;
}
.t-collabo-member-lb__text {
margin-bottom: 20px;
color: #000;
font-size: 16px;
font-size: 1.6rem;
font-weight: 500;
line-height: 1.75;
letter-spacing: .025em;
}
.t-collabo-member-lb__text .t-collabo-member-section__text {
display: block;
}
.t-collabo-member-lb__sns-group {
display: flex;
flex-wrap: wrap;
margin: auto -10px -5px;
}
.t-collabo-member-lb__sns-group-item {
max-width: 50%;
padding: 5px 10px;
}
.t-collabo-member-lb__sns-link {
display: flex;
align-items: center;
width: 200px;
max-width: 100%;
padding: 0 20px;
background-color: #e60012;
color: #FFF;
font-size: 18px;
font-size: 1.8rem;
font-weight: 700;
letter-spacing: .025em;
}
.t-collabo-member-lb__sns-link img {
margin-right: 10px;
}
.t-collabo-member-lb__btn {
width: 20px;
height: 20px;
padding: 0;
background: none;
border-top: 1px solid #c4c4c4;
border-right: 1px solid #c4c4c4;
border-bottom: none;
border-left: none;
position: absolute;
top: 0;
bottom: 0;
margin: auto;
}
div.t-collabo-member-lb__thumb:has(img[src*="menber_2"]){box-shadow:20px 20px 0px #733c93;border: 4px solid #733c93;}
.t-collabo-member-lb__name[data-eng=Bonjour]{color:#733c93;}
.theme-dozle .p-dozle__btn[href="https://x.com/bonj5555"]{background:#733c93;}
.theme-dozle .p-dozle__btn[href="https://www.youtube.com/channel/UC7fNaSMYW29jHQmYZgZ5rkA"]{background:#733c93;}
div.t-collabo-member-lb__thumb:has(img[src*="menber_3"]){box-shadow:20px 20px 0px #FCC700;border: 4px solid #FCC700;}
.t-collabo-member-lb__name[data-eng=Qnly]{color:#FCC700;}
.theme-dozle .p-dozle__btn[href="https://x.com/QnlyQ"]{background:#FCC700;}
.theme-dozle .p-dozle__btn[href="https://www.youtube.com/channel/UC5l8bnxxl26Q5PDG_jawcuw"]{background:#FCC700;}
div.t-collabo-member-lb__thumb:has(img[src*="menber_4"]){box-shadow:20px 20px 0px #54C3F1;border: 4px solid #54C3F1;}
.t-collabo-member-lb__name[data-eng=Oraf-Kun]{color:#54C3F1;}
.theme-dozle .p-dozle__btn[href="https://x.com/yukiorajp"]{background:#54C3F1;}
.theme-dozle .p-dozle__btn[href="https://www.youtube.com/channel/UCIEgmfyQSPwrjXt1QpmNv0w"]{background:#54C3F1;}
div.t-collabo-member-lb__thumb:has(img[src*="menber_5"]){box-shadow:20px 20px 0px #EB6D9A;border: 4px solid #EB6D9A;}
.t-collabo-member-lb__name[data-eng=ooharaMEN]{color:#EB6D9A;}
.theme-dozle .p-dozle__btn[href="https://x.com/oohara0013"]{background:#EB6D9A;}
.theme-dozle .p-dozle__btn[href="https://www.youtube.com/channel/UCJk7u2v3Ib7M0e-k8TWPx5Q"]{background:#EB6D9A;}
.t-collabo-member-lb__btn[name="prev"] {
right: calc(100% + 60px);
transform: rotate(45deg) skew(65deg, 65deg);
}
.t-collabo-member-lb__btn[name="next"] {
left: calc(100% + 60px);
transform: rotate(-135deg) skew(65deg, 65deg);
}
.t-collabo-member-lb__close {
padding-bottom: 45px;
background: none;
border: none;
position: absolute;
top: calc(100% + 25px);
right: 0;
left: 0;
margin: auto;
color: #c4c4c4;
font-size: 16px;
font-size: 1.6rem;
font-weight: 500;
letter-spacing: .025em;
}
.t-collabo-member-lb__close::before, .t-collabo-member-lb__close::after {
content: "";
display: block;
width: 63px;
height: 1px;
background-color: #c4c4c4;
position: absolute;
bottom: 15px;
left: 0;
right: 0;
margin: auto;
}
.t-collabo-member-lb__close::before {
transform: skewY(8deg) rotate(24deg);
}
.t-collabo-member-lb__close::after {
transform: skewY(8deg) rotate(-24deg);
}
@media screen and (max-width: 1023px) {
.t-collabo-member-lb__content {
min-height: inherit;
padding: 40px 25px;
}
.t-collabo-member-lb__thumb {
width: 190px;
box-shadow: 10px 10px 0 #e60012;
}
.t-collabo-member-lb__content-box {
margin-left: 45px;
}
.t-collabo-member-lb__btn[name="next"] {
left: calc(100% + 30px);
}
.t-collabo-member-lb__btn[name="prev"] {
right: calc(100% + 30px);
}
.t-collabo-member-lb__sns-link {
width: 175px;
padding: 0 10px;
}
}
@media screen and (max-width: 767px) {
.t-collabo-member__container {
padding: 55px 0;
}
.t-collabo-member__list {
margin-top: 25px;
}
.t-collabo-member-section:not(:last-child) {
margin-bottom: 45px;
}
.t-collabo-member-section__heading {
margin-bottom: 25px;
font-size: 17px;
font-size: 1.7rem;
}
.t-collabo-member-section__group {
margin: -10px -3px;
}
.t-collabo-member-section__group-item {
width: 50%;
padding: 10px 3px;
}
.t-collabo-member-section__thumb-profile {
transform: scale(.65);
transform-origin: bottom left;
}
.t-collabo-member-section__name {
margin-top: 15px;
font-size: 10px;
font-size: 1.0rem;
}
.t-collabo-member-section__name::before {
margin-bottom: 5px;
font-size: 17px;
font-size: 1.7rem;
}
/* lb */
.t-collabo-member-lb__content {
padding: 35px 12.5px 25px;
margin-top: 220px;
}
.t-collabo-member-lb__dialog {
padding: 0 20px;
}
.t-collabo-member-lb__btn {
width: 12px;
height: 12px;
bottom: calc(100% + 260px);
}
.t-collabo-member-lb__btn[name="next"] {
left: auto;
right: 6%;
}
.t-collabo-member-lb__btn[name="prev"] {
right: auto;
left: 6%;
}
.t-collabo-member-lb__close {
padding-bottom: 25px;
top: calc(100% + 10px);
font-size: 11px;
font-size: 1.1rem;
}
.t-collabo-member-lb__close::before, .t-collabo-member-lb__close::after {
width: 45px;
bottom: 10px;
}
.t-collabo-member-lb__thumb {
width: 135px;
position: absolute;
bottom: calc(100% + 20px);
right: 0;
left: 0;
margin: auto;
}
.t-collabo-member-lb__content-box {
width: 100%;
padding-bottom: 0;
margin-left: 0;
}
.t-collabo-member-lb__dept {
margin-bottom: 10px;
text-align: center;
font-size: 11px;
font-size: 1.1rem;
}
.t-collabo-member-lb__name {
margin-bottom: 12px;
text-align: center;
font-size: 10px;
font-size: 1.0rem;
}
.t-collabo-member-lb__name::before {
margin-bottom: 5px;
font-size: 22px;
font-size: 2.2rem;
}
.t-collabo-member-lb__text {
font-size: 11px;
font-size: 1.1rem;
}
.t-collabo-member-lb__sns-group {
justify-content: center;
width: calc(100% + 5px);
margin-right: -2.5px;
margin-left: -2.5px;
margin-bottom: -2.5px;
}
.t-collabo-member-lb__sns-group-item {
padding: 2.5px;
}
.t-collabo-member-lb__sns-link {
width: 125px;
font-size: 12px;
font-size: 1.2rem;
}
.t-collabo-member-lb__sns-link img {
width: 35px;
margin-right: 4px;
}
}
/* INFORMATION
------------------------------------------------------------ */
.t-collabo-information__container {
padding: 50px 0 100px;
}
.t-collabo-information__list {
width: 940px;
max-width: 100%;
margin: 50px auto 0;
}
.t-collabo-information__list-group {
display: flex;
flex-wrap: wrap;
margin: -5px;
}
.t-collabo-information__list-group-item {
display: flex;
width: 25%;
padding: 5px;
}
.t-collabo-information__card {
display: flex;
flex-direction: column;
width: 100%;
padding: 20px;
background-color: #222A33;
color: #FFF;
font-size: 14px;
font-size: 1.4rem;
font-weight: 500;
line-height: 1.857;
letter-spacing: .025em;
}
.t-collabo-information__thumb {
width: 100%;
max-height: 126px;
margin-bottom: 15px;
}
.t-collabo-information__thumb img {
width: 100%;
}
.t-collabo-information__title {
margin-bottom: 35px;
text-decoration: underline;
}
.t-collabo-information__except {
margin-bottom: 20px;
}
.t-collabo-information__category {
padding-left: 30px;
position: relative;
margin-top: auto;
font-size: 12px;
font-size: 1.2rem;
}
.t-collabo-information__category-icon {
width: 25px;
position: absolute;
top: -3px;
left: 0;
}
@media screen and (max-width: 1023px) {
.t-collabo-information__list-group-item {
width: 33.333%;
}
}
@media screen and (max-width: 767px) {
.t-collabo-information__container {
padding: 55px 0 50px;
}
.t-collabo-information__list {
margin-right: -5px;
margin-left: -5px;
}
.t-collabo-information__list-group-item {
width: 50%;
}
.t-collabo-information__card {
padding: 10px;
font-size: 11px;
font-size: 1.1rem;
}
.t-collabo-information__category {
padding-left: 20px;
font-size: 10px;
font-size: 1.0rem;
}
.t-collabo-information__category-icon {
width: 17px;
top: 1px;
}
}
/* pagetop
------------------------------------------------------------ */
.t-collabo__pagetop {
position: fixed;
right: 40px;
bottom: 40px;
color: #e60012;
font-size: 12px;
font-size: 1.2rem;
font-weight: 500;
line-height: 1;
letter-spacing: .025em;
transform: rotate(-90deg) translateX(100%);
transform-origin: right bottom;
right: 150px;
transform: rotate(0deg) translateX(100%);
z-index: 99;
}
.t-collabo__pagetop::after {
display: contents;
content: "";
display: block;
width: 50px;
height: 18px;
background-image: linear-gradient(-90deg, #e60012 50%, transparent 50%);
background-size: 10px 10px;
position: absolute;
left: 100%;
bottom: 0;
transform: skewX(45deg);
transform-origin: left top;
}
@media screen and (max-width: 767px) {
.t-collabo__pagetop {
display: none;
}
}
/* CSS Document */
/*------------------------------------------------------------
common
------------------------------------------------------------ */
/* font */
.c-font__manrope {
font-family: 'Manrope', sans-serif;
}
/* section */
.theme-dozle .t-collabo__section {
background-repeat: no-repeat;
background-size: cover;
background-position: center;
overflow: hidden;
}
/* bg */
/*
.p-dozle__bg-wire {
background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2024/11/pc_dozle_concept_bg_pc.png");
}
.p-dozle__bg-wire2 {
background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2022/09/bg_5.jpg");
background: #f7f7ff;
}
.p-dozle__bg-yellow {
background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2022/10/bg_3.jpg");
background: #e60012;
color: #070203;
}
.p-dozle__bg-dust {
background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2022/09/bg_4.jpg");
background: #f7f7ff;
}
.p-dozle__bg-reverse, .p-dozle__bg-reverse > * {
/*transform: scaleX(-1);*
}
@media screen and (max-width: 767px) {
.p-dozle__bg-wire {
background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2022/09/bg_2sp.png");
}
.p-dozle__bg-wire2 {
background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2022/09/bg_5sp.png");
}
.p-dozle__bg-yellow {
background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2022/10/bg_3sp.jpg");
}
.p-dozle__bg-dust {
background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2022/09/bg_4sp.png");
}
}
*/
/* heading */
.theme-dozle .t-collabo__heading {
padding-bottom: 0;
}
.theme-dozle .t-collabo__heading-left {
top: 50%;
transform: translateY(-50%);
transform-origin: center;
}
@media screen and (max-width: 1603px) {
.theme-dozle .t-collabo__heading-left {
display: none;
}
.theme-dozle .p-dz-feature01 .t-collabo__heading-left {
display: unset;
}
}
.theme-dozle .t-collabo__heading-left img,
.theme-dozle .t-collabo__heading-right img{
transform: translateX(calc(-50% + 48px)) rotate(-90deg);
}
.p-dozle__content-heading {
margin-bottom: 15px;
font-size: 30px;
font-size: 3.0rem;
font-weight: 700;
line-height: 1.6;
letter-spacing: .039em;
color: #333333;
}
@media screen and (max-width: 1240px) {
.theme-dozle .t-collabo__heading-left {
position: relative;
top: auto;
z-index: 2;
/*margin-top: 45px;*/
transform: none;
}
.theme-dozle .t-collabo__heading-left img {
transform: none;
}
}
@media screen and (max-width: 1603px) {
.p-dozle__content-heading {
text-align: center;
}
}
@media screen and (max-width: 767px) {
.theme-dozle .t-collabo__heading {
/*margin-right: -10px;
margin-left: -10px;*/
}
.theme-dozle .t-collabo__heading img {
width: auto;
max-height: 48px;
}
.p-dozle__content-heading {
font-size: 20px;
font-size: 2.0rem;
}
}
/* text */
.theme-dozle .t-collabo__text {
font-weight: 500;
line-height: 2.25;
letter-spacing: .039em;
}
.p-dozle__bg-yellow .t-collabo__text {
color: #070203;
}
.p-dozle__note {
margin-top: 15px;
font-size: 12px;
font-size: 1.2rem;
font-weight: 500;
letter-spacing: .039em;
color: #333333;
}
@media screen and (max-width: 767px) {
.p-dozle__note {
margin-top: 10px;
font-size: 10px;
font-size: 1.0rem;
text-align: left;
}
}
/* btn */
.theme-dozle .p-dozle__btn {
display: block;
width: calc(100% - 4px);
padding: 10px;
background-color: #FFE200;
position: relative;
margin: auto;
text-align: center;
color: #000;
font-size: 18px;
font-size: 1.8rem;
font-weight: 500;
transition: .3s;
max-width: 400px;
background-color: #e60012;
color: #ffffff;
border-radius: 30px;
border: #2e2e2e solid 2px;
box-shadow: inset 0px -4px 2px rgb(0 0 0 / 25%);
}
#special .p-dozle__btn {
margin: unset;
}
/*.theme-dozle .p-dozle__btn::before, .theme-dozle .p-dozle__btn::after, .theme-dozle .p-dozle__btn-deco, .theme-dozle .p-dozle__btn-deco::before, .theme-dozle .p-dozle__btn-deco::after {
content: "";
display: block;
background-color: #FFE200;
position: absolute;
}*/
.theme-dozle .p-dozle__btn::before, .theme-dozle .p-dozle__btn::after {
width: 2px;
height: 100%;
top: 0;
}
.theme-dozle .p-dozle__btn::before {
left: -5px;
}
.theme-dozle .p-dozle__btn::after {
right: -5px;
}
.theme-dozle .p-dozle__btn-deco {
width: 100%;
height: 2px;
left: 0;
}
.theme-dozle .p-dozle__btn-deco.is-top {
top: -5px;
}
.theme-dozle .p-dozle__btn-deco.is-bottom {
bottom: -5px;
}
.theme-dozle .p-dozle__btn-deco::before, .theme-dozle .p-dozle__btn-deco::after {
width: 4px;
height: 4px;
border-radius: 50%;
top: 50%;
transform: translateY(-50%);
}
.theme-dozle .p-dozle__btn-deco::before {
left: -6px;
}
.theme-dozle .p-dozle__btn-deco::after {
right: -6px;
}
.theme-dozle .p-dozle__btn-arrow {
position: absolute;
top: 0;
right: 14px;
bottom: 0;
margin: auto;
}
.theme-dozle .p-dozle__btn img {
transition: .3s;
}
.theme-dozle .p-dozle__btn img.is-hover {
display: none;
opacity: 0;
}
.theme-dozle .p-dozle__btn:hover {
background-color: #070203;
color: #ffffff;
}
.theme-dozle .p-dozle__btn:hover img.is-hover {
display: block;
opacity: 1;
}
.theme-dozle .p-dozle__btn:hover img:not(.is-hover) {
display: none;
opacity: 0;
}
@media screen and (max-width: 767px) {
.theme-dozle .p-dozle__btn {
font-size: 11px;
font-size: 1.1rem;
}
.theme-dozle .p-dozle__btn-arrow {
width: 7px;
right: 7px;
}
.theme-dozle .p-dozle__btn::before, .theme-dozle .p-dozle__btn::after {
width: 1px;
}
.theme-dozle .p-dozle__btn::before {
left: -3px;
}
.theme-dozle .p-dozle__btn::after {
right: -3px;
}
.theme-dozle .p-dozle__btn-deco {
height: 1px;
}
.theme-dozle .p-dozle__btn-deco.is-top {
top: -3px;
}
.theme-dozle .p-dozle__btn-deco.is-bottom {
bottom: -3px;
}
.theme-dozle .p-dozle__btn-deco::before, .theme-dozle .p-dozle__btn-deco::after {
width: 2px;
height: 2px;
}
.theme-dozle .p-dozle__btn-deco::before {
left: -3px;
}
.theme-dozle .p-dozle__btn-deco::after {
right: -3px;
}
}
/* pagetop */
.theme-dozle .t-collabo__pagetop {
color: #333;
}
.theme-dozle .t-collabo__pagetop::after {
background-image: linear-gradient(-90deg, #333 50%, transparent 50%);
}
/* header
------------------------------------------------------------ */
/* nav */
.theme-dozle .lb .closeBtn .rel span, .theme-dozle .menu-trigger .rel span {
background: #ffffff !important;
}
.theme-dozle .lb .closeBtn p, .theme-dozle .menu-trigger p, .theme-dozle nav li .en {
color: #e60012 !important;
}
.theme-dozle nav li .ja {
color: #e60012 !important;
font-size: 27px;
font-weight: 500;
}
/*------------------------------------------------------------
index
------------------------------------------------------------ */
/* MV
------------------------------------------------------------ */
.p-dozle-mv {
flex-direction: row;
min-height: 100vh;
padding-top: 70px;
background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2024/11/pc_dozle_mv_bg_pc04.jpg");
background-repeat: no-repeat;
background-size: cover;
background-position: center;
overflow: hidden;
}
.p-dozle-mv__container {
position: relative;
}
.p-dozle-mv__objects {
width: 100%;
height: 100%;
mix-blend-mode: screen;
position: absolute;
top: 0;
left: 0;
z-index: 1;
pointer-events: none;
}
.p-dozle-mv__object01, .p-dozle-mv__object02, .p-dozle-mv__object03, .p-dozle-mv__object04 {
position: absolute;
}
.p-dozle-mv__object01 {
width: 16.833%;
top: -5%;
left: 7.5%;
}
.p-dozle-mv__object02 {
width: 16.333%;
top: 10%;
right: -3.5%;
}
.p-dozle-mv__object03 {
width: 12.666%;
bottom: 10%;
left: -10%;
}
.p-dozle-mv__object04 {
width: 14.666%;
bottom: 20%;
right: -20%;
}
.p-dozle-mv__contents {
display: flex;
align-items: center;
padding-left: 50px;
position: relative;
margin: auto;
z-index: 2;
}
.p-dozle-mv__heading {
width: 600px;
max-width: 50%;
flex-shrink: 0;
}
.p-dozle-mv__heading-collabo {
margin-bottom: 10px;
text-align: center;
color: #000;
font-size: 54px;
font-size: 5.4rem;
font-weight: 600;
}
.p-dozle-mv__heading-collabo span {
margin: 0 .25em;
font-size: 50px;
font-size: 5.0rem;
}
.p-dozle-mv__heading-title {
margin: 0 46px;
background: #000;
position: relative;
text-align: center;
color: #FFF;
font-size: 17px;
font-size: 1.7rem;
font-weight: 700;
letter-spacing: .039em;
}
.p-dozle-mv__heading-title span {
font-size: 20px;
font-size: 2.0rem;
}
.p-dozle-mv__heading-title-midium {
font-weight: 500;
}
.p-dozle-mv__heading-title::before, .p-dozle-mv__heading-title::after {
content: "";
display: block;
width: 44px;
height: 100%;
background-image: url(https://www.pc-koubou.jp/wp/wp-content/uploads/2022/09/dozle-heading-deco.png);
background-repeat: no-repeat;
background-size: 100% 100%;
background-position: center;
position: absolute;
top: 0;
}
.p-dozle-mv__heading-title::before {
right: calc(100% + 1px);
}
.p-dozle-mv__heading-title::after {
left: calc(100% + 1px);
transform: scale(-1);
}
.p-dozle-mv__heading-logo {
margin-top: 15px;
text-align: center;
}
.p-dozle-mv__image {
display: block;
margin: 0 -2.25% 0 -8.25%;
}
.p-dozle-mv__image img {
width: 100%;
}
.p-dozle-mv__btn-wrap {
margin-top: 20px;
}
.theme-dozle .p-dozle-mv__btn-wrap .p-dozle__btn {
max-width: 400px;
background-color: #e60012;
color: #ffffff;
border-radius: 30px;
border: #2e2e2e solid 2px;
box-shadow: inset 0px -4px 2px rgb(0 0 0 / 25%);
}
.theme-dozle .p-dozle-mv__btn-wrap .p-dozle__btn:hover {
background-color: #000000;
}
/*.theme-dozle .p-dozle-mv__btn-wrap .p-dozle__btn::before, .theme-dozle .p-dozle-mv__btn-wrap .p-dozle__btn::after, .theme-dozle .p-dozle-mv__btn-wrap .p-dozle__btn-deco, .theme-dozle .p-dozle-mv__btn-wrap .p-dozle__btn-deco::before, .theme-dozle .p-dozle-mv__btn-wrap .p-dozle__btn-deco::after {
background-color: #070203;
}*/
.theme-dozle main#top .p-dozle-feature05__images-item .p-dozle-feature05__images-image img {
border: 1px solid #eb6d9a;
}
.theme-dozle main#top .t-collabo-special__slides-wrap .t-collabo-special__slides .t-collabo-special__slides-item .pc-none {
width: 70%;
margin: 10% auto 0px;
}
.theme-dozle main#top nav li .en {
font-family: 'Manrope', sans-serif;
}
.theme-dozle main#top .menu-trigger p.abs .anim {
font-family: 'Manrope', sans-serif;
}
@media screen and (max-width: 1603px) {
.p-dozle-mv__contents {
padding-left: 0;
}
}
@media screen and (max-width: 767px) {
.p-dozle-mv {
padding-top: 50px;
/*add 2023/05/17*/
background-image: url(https://www.pc-koubou.jp/wp/wp-content/uploads/2024/11/pc_dozle_mv_sp.png);
min-height: 800px;
height: 100vh;
/*add 2023/05/17*/
background: linear-gradient(45deg, #f7f7ff, transparent);
}
.p-dozle-mv__container {
position: static;
padding-top: 25px;
padding-bottom: 0;
}
.p-dozle-mv__contents {
padding-bottom: 25px;
flex-direction: column;
align-items: center;
height: 100%;
}
.p-dozle-mv__heading {
width: 100%;
max-width: inherit;
text-align: center;
/*add 2023/05/17*/
display: flex;
flex-direction: column;
height: 100%;
background-image: url(https://www.pc-koubou.jp/wp/wp-content/uploads/2024/11/pc_1.png);
/*background-image: url(https://www.pc-koubou.jp/wp/wp-content/uploads/2025/05/pc_dozle_mv_pc.png);*/
background-position: top 26% center;
background-size: calc(90% + 0px);
background-repeat: no-repeat;
/*add 2023/05/17*/
}
.p-dozle-mv__heading-collabo {
margin-bottom: 0;
}
.p-dozle-mv__heading-collabo, .p-dozle-mv__heading-collabo span {
font-size: 34px;
font-size: 3.4rem;
width: 200px;
margin: 0 auto;
}
.p-dozle-mv__heading-title {
margin: 0 25px;
font-size: 10px;
font-size: 1.0rem;
}
.p-dozle-mv__heading-title::before, .p-dozle-mv__heading-title::after {
width: 24px;
}
.p-dozle-mv__heading-title span {
font-size: 11px;
font-size: 1.1rem;
}
.p-dozle-mv__heading-logo {
/*add 2023/05/17*/
order: 2;
display: block;
width: 100%;
margin: 1% auto 0;
position: static;
transform: translateX(0);
}
.p-dozle-mv__btn-wrap {
width: 100%;
/*add 2023/05/17*/
position: static;
margin-top: auto;
/*add 2023/05/17*/
}
.theme-dozle .p-dozle-mv__btn-wrap .p-dozle__btn {
max-width: 290px;
}
.p-dozle-mv__image {
display: none;/*update 2023/05/17*/
}
.p-dozle-mv__object01 {
width: 31.5625%;
top: 20px;
left: -4.375%;
}
.p-dozle-mv__object02 {
width: 30.46875%;
top: 80px;
right: -4.53125%;
}
.p-dozle-mv__object03 {
width: 23.75%;
left: -8.125%;
bottom: 70px;
}
.p-dozle-mv__object04 {
width: 27.34375%;
right: -11.25%;
bottom: 185px;
}
}
/* CONCEPT
------------------------------------------------------------ */
.p-dozle-concept {
min-height: 100vh;
padding-top: 70px;
background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2024/11/pc_dozle_concept_bg_pc.png");
}
.p-dozle-concept__container {
flex-direction: row;
padding-bottom: 35px;
}
.p-dozle-concept__contents {
width: 415px;
max-width: 100%;
flex-shrink: 0;
padding-left: 50px;
margin-top: 254px;
margin-right: 10px;
}
.p-dozle-concept__heading {
line-height: 1.25;
margin-right: -1em;
}
.p-dozle-concept__heading span {
font-size: 30px;
font-size: 3.0rem;
}
.p-dozle-concept__image {
margin-left: 110px;
}
@media screen and (max-width: 1603px) {
.p-dozle-concept__container {
flex-direction: column;
align-items: center;
}
.p-dozle-concept {
background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2024/11/pc_dozle_concept_bg_sp.jpg");
min-height: unset;
padding-top: 40px;
}
.p-dozle-concept__contents {
width: 100%;
padding-left: 0;
margin: 0 0 40px;
}
.p-dozle-concept__image {
margin-left: 0px;
}
}
@media screen and (max-width: 1023px) {
.p-dozle-concept__heading {
margin-right: 0;
}
}
@media screen and (max-width: 767px) {
.p-dozle-concept__container {
padding-top: 30px;
padding-bottom: 30px;
}
.p-dozle-concept__heading span {
font-size: 24px;
font-size: 2.4rem;
}
}
/* FREATURES
------------------------------------------------------------ */
.t-collabo-features__container {
position: relative;
}
.p-dozle-features__num {
position: absolute;
bottom: 40px;
z-index: 2;
}
.p-dozle-features__num.is-right {
right: 50px;
}
.p-dozle-features__num.is-left {
left: 50px;
}
.p-dozle-features__heading-eng {
margin-bottom: 50px;
}
.theme-dozle .t-collabo__text + .p-dozle__content-heading {
margin-top: 50px;
}
.p-dozle-features__note {
margin-top: 20px;
font-size: 12px;
font-size: 1.2rem;
letter-spacing: .039em;
}
@media screen and (max-width: 1023px) {
.p-dozle-features__heading-eng {
text-align: center;
}
}
@media screen and (max-width: 1603px) {
.p-dozle-features__num {
position: relative;
top: auto;
right: auto !important;
bottom: auto;
left: auto !important;
margin-bottom: 45px;
text-align: center;
}
.p-dozle-features__num img {
width: auto;
height: 37px;
}
.p-dozle-features__heading-eng {
margin-bottom: 25px;
}
.p-dozle-features__heading-eng img {
display: block;
width: auto;
height: 17px;
margin: auto;
}
.theme-dozle .t-collabo__text + .p-dozle__content-heading {
margin-top: 25px;
}
}
/* 01 */
.p-dozle-feature01__container {
/*min-height: 100vh;*/
flex-direction: row-reverse;
flex-wrap: nowrap;
position: relative;
}
.p-dozle-feature01__contents, .p-dozle-feature01__image {
position: relative;
z-index: 1;
}
.p-dozle-feature01__contents {
width: 490px;
max-width: 100%;
margin: auto 0;
flex-shrink: 0;
margin-bottom: 30px;
}
.p-dozle-feature01__heading-eng {
margin-bottom: 50px;
}
.p-dozle-feature01__contents .p-dozle-feature01__text {
max-width: 440px;
}
.p-dozle-feature01__image {
margin: auto -1% -50px -4.5%;
}
.p-reddle-feature01__objects {
mix-blend-mode: screen;
pointer-events: none;
}
.p-reddle-feature01__object01, .p-reddle-feature01__object02, .p-reddle-feature01__object03 {
position: absolute;
}
.p-reddle-feature01__object01 {
width: 14.833%;
top: -10%;
left: 4.166%;
}
.p-reddle-feature01__object02 {
width: 10.5%;
top: -2%;
left: 50%;
}
.p-reddle-feature01__object03 {
width: 21.083%;
top: 50%;
right: -16%;
}
@media screen and (max-width: 1603px) {
.p-dozle-feature01__container {
min-height: inherit;
flex-direction: column;
align-items: center;
}
.p-dozle-feature01__contents {
/*width: 100%;*/
width: 670px;
}
.p-dozle-feature01__contents .p-dozle-feature01__text {
max-width: 100%;
}
.p-dozle-feature01__image {
margin-right: -20px;
margin-left: -20px;
}
}
@media screen and (max-width: 767px) {
.p-dozle-feature01__container {
padding-top: 45px;
}
.p-dozle-feature01__heading-eng {
margin-bottom: 25px;
}
.p-reddle-feature01__objects {
display: none;
}
.p-dozle-feature01__image {
margin-bottom: -60px;
}
}
/* 02 */
.p-dozle-feature02__container {
flex-direction: row;
align-items: center;
}
.p-dozle-feature02__contents {
width: 670px;
max-width: 100%;
padding-left: 50px;
padding-bottom: 70px;
}
.p-dozle-feature02__contents-wrap {
display: flex;
margin-top: 50px;
}
.p-dozle-feature02__contents-text-wrap {
max-width: 440px;
}
.p-dozle-feature02__configuration {
margin-left: 30px;
}
.p-dozle-feature02__image {
margin: -50px -6.666% -50px 0;
}
@media screen and (max-width: 1603px) {
.p-dozle-feature02__container, .p-dozle-feature02__contents-wrap {
flex-direction: column;
}
.p-dozle-feature02__contents-wrap {
margin-top: 0;
}
.p-dozle-feature02__contents {
padding-left: 0;
}
.p-dozle-feature02__contents-text-wrap {
max-width: 100%;
margin-bottom: 30px;
}
.p-dozle-feature02__configuration {
margin-left: 0;
}
.p-dozle-feature02__image {
margin: auto -20px -50px;
text-align: center;
}
.theme-dozle .t-collabo-filter__image02-name {
margin-bottom: 20px;
}
}
/* 03 */
.p-dozle-feature03 {
text-align: center;
}
.theme-dozle .t-collabo-filter__images-name::before {
display: none;
}
.theme-dozle .t-collabo-filter > * {
position: relative;
z-index: 2;
}
.theme-dozle .t-collabo-filter__images {
z-index: 1 !important;
}
.theme-dozle .t-collabo-filter__image01-name {
left: 63%;
}
.theme-dozle .t-collabo-filter__image02-name {
top: 24%;
right: 31%;
}
.theme-dozle .t-collabo-filter__images-item img {
width: auto;
}
@media screen and (max-width: 1603px) {
.p-dozle-feature03 .t-collabo__text {
text-align: left;
}
.p-dozle-feature03__container {
max-width: 670px;
}
.theme-dozle .t-collabo-filter__images {
margin-top: 20px;
margin-bottom: -60px;
}
.theme-dozle .t-collabo-filter__images-item {
display: flex;
flex-direction: column;
align-items: center;
}
.theme-dozle .t-collabo-filter__images-name {
overflow: hidden;
}
.theme-dozle .t-collabo-filter__images-name img {
max-width: calc(100% + 15px);
width: auto;
height: 12px;
}
.theme-dozle .t-collabo-filter__image01-name img {
margin-left: -15px;
}
.theme-dozle .t-collabo-filter__image02-name img {
margin-right: -15px;
}
}
/* 04 */
.p-dozle-feature04__container {
padding: 80px 50px 20px;
flex-direction: row;
}
.p-dozle-feature04__contents {
margin-top: 50px;
}
.p-dozle-feature04__image {
margin-left: auto;
}
@media screen and (max-width: 1603px) {
.p-dozle-feature04__container {
padding: 45px 0 25px;
flex-direction: column;
max-width: 670px;
}
.p-dozle-feature04__contents {
margin-top: 0;
}
.p-dozle-feature04__image {
margin: 45px -20px 0 0;
text-align: center;
}
}
/* 05 */
.p-dozle-feature05__container {
flex-direction: row-reverse;
}
.p-dozle-feature05__contents {
width: 490px;
max-width: 100%;
padding-right: 50px;
}
.p-dozle-feature05__images {
display: flex;
margin: 20px -5px 0;
}
.p-dozle-feature05__images-item {
max-width: 50%;
padding: 0 5px;
}
.p-dozle-feature05__images-name {
margin-top: 5px;
text-align: center;
color: #FFE200;
font-size: 10px;
font-size: 1.0rem;
}
.p-dozle-feature05__image {
margin-right: auto;
margin-bottom: -50px;
}
@media screen and (max-width: 1603px) {
.p-dozle-feature05__container {
flex-direction: column;
max-width: 670px;
}
.p-dozle-feature05__contents {
width: 100%;
padding-right: 0;
}
.p-dozle-feature05__images {
justify-content: center;
}
.p-dozle-feature05__image {
margin: 0px -35px -30px;
text-align: center;
}
}
@media screen and (max-width: 767px) {
.p-dozle-feature05__images {
margin-right: -3px;
margin-left: -3px;
}
.p-dozle-feature05__images-item {
padding: 0 3px;
}
}
/* COLOR
------------------------------------------------------------ */
.p-dozle-color__container {
padding-right: 50px;
padding-left: 50px;
}
.p-dozle-color__contents {
align-items: center;
padding-right: 0;
padding-left: 0;
margin-top: 40px;
}
.p-dozle-color__contents-wrap {
max-width: 320px;
}
.theme-dozle .t-collabo-special__slides-wrap {
width: 1158px;
right: 310px;
}
.theme-dozle .t-collabo-special__slides {
padding-bottom: 51.813%;
padding-bottom: 46.813%;
}
.theme-dozle .t-collabo-special__color-dl {
margin-right: -50px;
}
.theme-dozle .t-collabo-special__color-dl dt {
margin-bottom: 25px;
color: #ffffff;
}
.theme-dozle .t-collabo-special__color-dl dt span {
margin-left: -40px;
}
@media screen and (max-width: 767px) {
.theme-dozle .t-collabo-special__color-dl dt span {
margin-left: -30px;
}
}
.theme-dozle .t-collabo-special__color-dl dt span::before {
display: none;
}
.theme-dozle .t-collabo-special__color-dl dt span img {
display: block;
}
.theme-dozle .t-collabo-special__tabs-label[for="specialInputRed"]::after {
background-color: #c80000;
}
.theme-dozle .t-collabo-special__tabs-label[for="specialInputPurple"]::after {
background-color: #733c93;
}
.theme-dozle .t-collabo-special__tabs-label[for="specialInputYellow"]::after {
background-color: #fcc700;
}
.theme-dozle .t-collabo-special__tabs-label[for="specialInputBlue"]::after {
background-color: #54c3f1;
}
.theme-dozle .t-collabo-special__tabs-label[for="specialInputPink"]::after {
background-color: #eb6d9a;
}
.theme-dozle #specialInputRed:checked ~ .t-collabo-special__slides-wrap #specialSlideRed,
.theme-dozle #specialInputPurple:checked ~ .t-collabo-special__slides-wrap #specialSlidePurple,
.theme-dozle #specialInputYellow:checked ~ .t-collabo-special__slides-wrap #specialSlideYellow,
.theme-dozle #specialInputBlue:checked ~ .t-collabo-special__slides-wrap #specialSlideBlue,
.theme-dozle #specialInputPink:checked ~ .t-collabo-special__slides-wrap #specialSlidePink {
opacity: 1;
}
.theme-dozle #specialInputRed:checked ~ .t-collabo-special__contents-wrap .t-collabo-special__tabs-label[for="specialInputRed"]::after,
.theme-dozle #specialInputPurple:checked ~ .t-collabo-special__contents-wrap .t-collabo-special__tabs-label[for="specialInputPurple"]::after,
.theme-dozle #specialInputYellow:checked ~ .t-collabo-special__contents-wrap .t-collabo-special__tabs-label[for="specialInputYellow"]::after,
.theme-dozle #specialInputBlue:checked ~ .t-collabo-special__contents-wrap .t-collabo-special__tabs-label[for="specialInputBlue"]::after,
.theme-dozle #specialInputPink:checked ~ .t-collabo-special__contents-wrap .t-collabo-special__tabs-label[for="specialInputPink"]::after {
opacity: 1;
}
.theme-dozle .t-collabo-special__note {
margin-right: -50px;
}
.p-dozle-color__btn-wrap {
margin-top: 40px;
/*margin-right: -50px;*/
/*margin-bottom: -15px;*/
}
@media screen and (max-width: 1603px) {
.p-dozle-color__container {
padding-right: 0;
padding-left: 0;
}
.theme-dozle .t-collabo-special__color-dl {
margin-right: 0;
}
.theme-dozle .t-collabo-special__note {
margin-right: 0;
}
.p-dozle-color__btn-wrap {
margin-right: 0;
}
}
@media screen and (max-width: 1023px) {
.p-dozle-color__contents {
margin-top: 25px;
}
.p-dozle-color__contents-wrap {
max-width: 100%;
}
.theme-dozle .t-collabo-special__slides-wrap {
width: 149.375%;
max-width: 1158px;
}
.theme-dozle .t-collabo-special__slides {
padding-bottom: 100%;
}
.theme-dozle .t-collabo-special__tabs {
flex-direction: column;
padding-top: calc(100% + 40px + 25px);
}
.theme-dozle .t-collabo-special__tabs-item + .t-collabo-special__tabs-item {
margin-top: 5px;
}
.theme-dozle .t-collabo-special__tabs-label {
margin-bottom: 0;
vertical-align: middle;
}
.theme-dozle .t-collabo-special__tabs-label::before {
top: -1px;
}
.theme-dozle .t-collabo-special__tabs-label::after {
top: 1px;
}
.theme-dozle .t-collabo-special__tabs-label img {
display: block;
width: auto;
height: 14px;
}
.theme-dozle .t-collabo-special__color-dl dt {
margin-bottom: 15px;
overflow: hidden;
}
}
@media screen and (max-width: 767px) {
.theme-dozle .t-collabo-special__container {
padding-bottom: 30px;
}
.theme-dozle .t-collabo-special__color-dl dt span img {
display: block;
width: auto;
height: 14px;
}
.theme-dozle .t-collabo-special__note {
margin-top: 5px;
font-size: 10px;
font-size: 1.0rem;
}
.p-dozle-color__btn-wrap {
margin-top: 20px;
margin-bottom: 0;
width: 100%;
}
}
/* SPECIAL
------------------------------------------------------------ */
.p-dozle-special-sub {
background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2023/07/bg_6.jpg");
background: #f7f7ff;
}
.theme-dozle .t-collabo-special-sub__section {
align-items: flex-start;
margin-right: 0px;
margin-left: 0px;
border-bottom: 1px solid #c4c4c4;
padding: 70px 45px;
}
#special_panel .t-collabo-special-sub__section {
align-items: flex-start;
margin-right: 0px;
margin-left: 0px;
border-bottom: unset;
padding: 20px 45px 0 45px;
}
.theme-dozle .t-collabo-special-sub__section:last-child {
border-bottom: unset;
padding: 70px 45px 0px 45px;
}
.theme-dozle .t-collabo__heading + .t-collabo-special-sub__section {
margin-top: 30px;
}
.theme-dozle .t-collabo-special-sub__contents, .t-collabo-special-sub__image {
padding: 0 20px !important;
}
@media screen and (max-width: 1240px) {
.theme-dozle .t-collabo-special-sub__contents, .t-collabo-special-sub__image {
padding: 0 0px !important;
}}
.theme-dozle .t-collabo-special-sub__contents {
width: 41.182%;
}
.theme-dozle .t-collabo-special-sub__image {
width: 58.818%;
}
.p-dozle-special__section-heading {
margin: 40px -1em 15px 0;
}
.theme-dozle .t-collabo-special-sub__text {
max-width: 400px;
}
.p-dozle-special__btn-wrap {
max-width: 365px;
margin-top: 40px;
}
@media screen and (max-width: 1023px) {
.theme-dozle .t-collabo-special-sub__contents, .theme-dozle .t-collabo-special-sub__image {
width: 100%;
max-width: inherit !important;
}
.p-dozle-special__section-heading {
margin: 25px 0 10px;
}
.theme-dozle .t-collabo-special-sub__text {
max-width: 100%;
}
}
@media screen and (max-width: 767px) {
.p-dozle-special-sub {
background: #000;
}
#special .t-collabo-special-sub__section {
position: relative;
padding-bottom: 55px !important;
}
.theme-dozle .t-collabo__heading + .t-collabo-special-sub__section {
margin-top: 45px;
}
.p-dozle__heading-eng img {
display: block;
width: auto;
height: 17px;
margin: auto;
}
.p-dozle-special__btn-wrap {
max-width: 260px;
position: absolute;
right: 0;
bottom: 0;
left: 0;
margin: auto;
}
}
/* CAMPAIGN
------------------------------------------------------------ */
/*
.theme-dozle .t-collabo-campaign__frame, .t-collabo-campaign__frame .t-collabo__text {
color: #FFF;
}
.theme-dozle .t-collabo-campaign__frame {
border-color: #FFE200;
}
.theme-dozle .t-collabo-campaign__text {
margin-top: 15px;
}
.theme-dozle .t-collabo-campaign__period-frame {
font-weight: 400;
}
.theme-dozle .t-collabo-campaign__btn-wrap {
max-width: 490px;
margin-top: 35px;
}
@media screen and (max-width: 1023px) {
.theme-dozle .t-collabo-campaign__frame-contents {
text-align: left;
}
.theme-dozle .t-collabo-campaign__period-frame {
text-align: center;
}
.theme-dozle .t-collabo-campaign__btn-wrap {
margin-right: auto;
margin-left: auto;
}
}
@media screen and (max-width: 767px) {
.theme-dozle .t-collabo-campaign__frame {
margin-top: 25px;
}
}
*/
/* LINEUP
------------------------------------------------------------ */
.theme-dozle .t-collabo-lineup__section-heading-area {
background-repeat: no-repeat;
background-size: cover;
background-position: center;
background: #c80000;
}
.theme-dozle .lineup_list h3 {
background: #f5f5f5;
color: #000;
}
.lineup_list .p-dozle-lineup__note {
background: none;
padding: 0;
text-align: left;
color: #333;
font-size: 16px;
font-size: 1.6rem;
font-weight: 400;
}
@media screen and (max-width: 1023px) {
.theme-dozle .t-collabo-lineup__section-heading-area {
padding-right: 20px;
padding-left: 20px;
}
.lineup_list .p-dozle-lineup__note {
padding-right: 20px;
padding-left: 20px;
}
}
@media screen and (max-width: 767px) {
.lineup_list .p-dozle-lineup__note {
font-size: 14px;
font-size: 1.4rem;
}
}
/* ABOUT
------------------------------------------------------------ */
/*
.theme-dozle .t-collabo-about {
min-height: 100vh;
background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2022/10/bg_7.jpg");
}*/
.p-dozle-about__container {
padding-right: 50px;
padding-left: 50px;
}
.theme-dozle .t-collabo-about__contents-right {
max-width: 100%;
}
/*.theme-dozle .t-collabo-about__logo {
margin-bottom: 85px;
}*/
.theme-dozle .t-collabo-about__link-group-item:not(:last-child) {
margin-bottom: 20px;
}
/*
.theme-dozle .p-dozle-about .p-dozle__btn {
background-color: #070203;
color: #FFE200;
}
.theme-dozle .p-dozle-about .p-dozle__btn:hover {
background-color: #FFE200;
color: #070203;
}
*/
.theme-dozle .p-dozle-about .p-dozle__btn::before, .theme-dozle .p-dozle-about .p-dozle__btn::after, .theme-dozle .p-dozle-about .p-dozle__btn-deco, .theme-dozle .p-dozle-about .p-dozle__btn-deco::before, .theme-dozle .p-dozle-about .p-dozle__btn-deco::after {
background-color: #070203;
}
@media screen and (max-width: 1603px) {
.p-dozle-about__container {
padding-right: 0;
padding-left: 0;
}
}
@media screen and (max-width: 767px) {
.theme-dozle .t-collabo-about {
min-height: inherit;
background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2022/10/bg_6sp.jpg");
}
.p-dozle-about__container {
padding-top: 25px;
padding-bottom: 30px;
}
.theme-dozle .t-collabo-about__sub-heading {
margin-bottom: 15px;
}
.t-collabo-about__contents-right {
margin-top: 40px;
}
.theme-dozle .t-collabo-about__logo {
width: 250px;
margin: 0 auto 30px;
}
.theme-dozle .t-collabo-about__link-group-item:not(:last-child) {
margin-bottom: 20px;
}
}
/* MEMBER
------------------------------------------------------------ */
.theme-dozle .t-collabo-member {
/* background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2022/09/bg_4.jpg");*/
background-repeat: repeat-y;
background-size: contain;
}
.theme-dozle .t-collabo-member-section__thumb {
transition: .3s;
}
.theme-dozle .t-collabo-member-section__card:hover .t-collabo-member-section__thumb {
transform: translateY(-5px) skewY(-8deg);
}
.theme-dozle .t-collabo-member-section__heading.red{
color: #c80000;
}
.theme-dozle .t-collabo-member-section__heading.purple{
color: #733c93;
}
.theme-dozle .t-collabo-member-section__heading.yellow{
color: #fcc700;
}
.theme-dozle .t-collabo-member-section__heading.blue{
color: #54c3f1;
}
.theme-dozle .t-collabo-member-section__heading.pink{
color: #eb6d9a;
}
.theme-dozle .t-collabo-member-section__thumb-profile {
background-color: #FFE200;
font-family: 'Manrope', sans-serif;
font-style: italic;
font-weight: 700;
color: #ffffff;
}
.theme-dozle .t-collabo-member-section__thumb-profile.red {
background-color: #c80000;
}
.theme-dozle .t-collabo-member-section__thumb-profile.purple {
background-color: #733c93;
}
.theme-dozle .t-collabo-member-section__thumb-profile.yellow {
background-color: #fcc700;
}
.theme-dozle .t-collabo-member-section__thumb-profile.blue {
background-color: #54c3f1;
}
.theme-dozle .t-collabo-member-section__thumb-profile.pink {
background-color: #eb6d9a;
}
.theme-dozle .t-collabo-member-section__thumb-profile.red::before {
border-bottom-color: #c80000;
}
.theme-dozle .t-collabo-member-section__thumb-profile.purple::before {
border-bottom-color: #733c93;
}
.theme-dozle .t-collabo-member-section__thumb-profile.yellow::before {
border-bottom-color: #fcc700;
}
.theme-dozle .t-collabo-member-section__thumb-profile.blue::before {
border-bottom-color: #54c3f1;
}
.theme-dozle .t-collabo-member-section__thumb-profile.pink::before {
border-bottom-color: #eb6d9a;
}
.theme-dozle .t-collabo-member-section__thumb-profile.red::after {
background-image: linear-gradient(-90deg, #c80000 50%, transparent 50%);
}
.theme-dozle .t-collabo-member-section__thumb-profile.purple::after {
background-image: linear-gradient(-90deg, #733c93 50%, transparent 50%);
}
.theme-dozle .t-collabo-member-section__thumb-profile.yellow::after {
background-image: linear-gradient(-90deg, #fcc700 50%, transparent 50%);
}
.theme-dozle .t-collabo-member-section__thumb-profile.blue::after {
background-image: linear-gradient(-90deg, #54c3f1 50%, transparent 50%);
}
.theme-dozle .t-collabo-member-section__thumb-profile.pink::after {
background-image: linear-gradient(-90deg, #eb6d9a 50%, transparent 50%);
}
.theme-dozle .t-collabo-member-section__thumb-inner.red {
border-color: #c80000;
}
.theme-dozle .t-collabo-member-section__thumb-inner.purple {
border-color: #733c93;
}
.theme-dozle .t-collabo-member-section__thumb-inner.yellow {
border-color: #fcc700;
}
.theme-dozle .t-collabo-member-section__thumb-inner.blue {
border-color: #54c3f1
}
.theme-dozle .t-collabo-member-section__thumb-inner.pink {
border-color: #eb6d9a;
}
.theme-dozle .t-collabo-member-section__name.red {
color: #c80000;
}
.theme-dozle .t-collabo-member-section__name.purple {
color: #733c93;
}
.theme-dozle .t-collabo-member-section__name.yellow {
color: #fcc700;
}
.theme-dozle .t-collabo-member-section__name.blue {
color: #54c3f1;
}
.theme-dozle .t-collabo-member-section__name.pink {
color: #eb6d9a;
}
/* lb */
.theme-dozle .t-collabo-member-lb__content {
background-color: #fff;
}
.theme-dozle .t-collabo-member-lb__thumb.red{
border-color: #c80000;
box-shadow: 20px 20px 0 #c80000;
}
.theme-dozle .t-collabo-member-lb__thumb.purple {
border-color: #733c93;
box-shadow: 20px 20px 0 #733c93;
}
.theme-dozle .t-collabo-member-lb__thumb.yellow {
border-color: #fcc700;
box-shadow: 20px 20px 0 #fcc700;
}
.theme-dozle .t-collabo-member-lb__thumb.blue {
border-color: #54c3f1;
box-shadow: 20px 20px 0 #54c3f1;
}
.theme-dozle .t-collabo-member-lb__thumb.pink {
border-color: #eb6d9a;
box-shadow: 20px 20px 0 #eb6d9a;
}
.theme-dozle .t-collabo-member-lb__content-box {
padding-bottom: 50px;
}
.theme-dozle .t-collabo-member-lb__name.red, .theme-dozle .t-collabo-member-lb__close.red {
color: #c80000;
}
.theme-dozle .t-collabo-member-lb__name.purple, .theme-dozle .t-collabo-member-lb__close.purple {
color: #733c93;
}
.theme-dozle .t-collabo-member-lb__name.yellow, .theme-dozle .t-collabo-member-lb__close.yellow {
color: #fcc700;
}
.theme-dozle .t-collabo-member-lb__name.blue, .theme-dozle .t-collabo-member-lb__close.blue {
color: #54c3f1;
}
.theme-dozle .t-collabo-member-lb__name.pink, .theme-dozle .t-collabo-member-lb__close.pink {
color: #eb6d9a;
}
.theme-dozle .t-collabo-member-lb__text {
line-height: 2.25;
letter-spacing: .039em;
}
.theme-dozle .t-collabo-member-lb__sns-group {
margin-bottom: -10px;
}
.theme-dozle .t-collabo-member-lb__sns-group-item {
padding: 10px;
}
.theme-dozle .t-collabo-member-lb__sns-link {
display: flex;
width: 220px;
padding: 0 20px;
}
.theme-dozle .t-collabo-member-lb__btn.red {
border-top-color: #c80000;
border-right-color: #c80000;
}
.theme-dozle .t-collabo-member-lb__btn.purple {
border-top-color: #733c93;
border-right-color: #733c93;
}
.theme-dozle .t-collabo-member-lb__btn.yellow {
border-top-color: #fcc700;
border-right-color: #fcc700;
}
.theme-dozle .t-collabo-member-lb__btn.blue {
border-top-color: #54c3f1;
border-right-color: #54c3f1;
}
.theme-dozle .t-collabo-member-lb__btn.pink {
border-top-color: #eb6d9a;
border-right-color: #eb6d9a;
}
.theme-dozle .t-collabo-member-lb__close {
padding-bottom: 30px;
font-style: italic;
font-weight: 700;
}
.theme-dozle .t-collabo-member-lb__close.red::before, .theme-dozle .t-collabo-member-lb__close.red::after {
background-color: #c80000;
}
.theme-dozle .t-collabo-member-lb__close.purple::before, .theme-dozle .t-collabo-member-lb__close.purple::after {
background-color: #733c93;
}
.theme-dozle .t-collabo-member-lb__close.yellow::before, .theme-dozle .t-collabo-member-lb__close.yellow::after {
background-color: #fcc700;
}
.theme-dozle .t-collabo-member-lb__close.blue::before, .theme-dozle .t-collabo-member-lb__close.blue::after {
background-color: #54c3f1;
}
.theme-dozle .t-collabo-member-lb__close.pink::before, .theme-dozle .t-collabo-member-lb__close.pink::after {
background-color: #eb6d9a;
}
h3.p-dozle__content-heading_campaign {
font-size: 27px;
color: #ffe109;
}
@media screen and (max-width: 1023px) {
.theme-dozle .t-collabo-member-lb__sns-link {
width: 175px;
padding: 0;
}
}
@media screen and (max-width: 767px) {
h3.p-dozle__content-heading_campaign {
font-size: 20px;
color: #FFE200;
text-align: center;
}
.theme-dozle .t-collabo-member-lb__content {
padding-top: 45px;
}
.theme-dozle .t-collabo-member-lb__thumb {
bottom: calc(100% + 35px)
}
.theme-dozle .t-collabo-member-lb__content-box {
padding-bottom: 0;
}
.theme-dozle .t-collabo-member-lb__sns-link {
width: 125px;
font-size: 11px;
font-size: 1.1rem;
}
}
.t-collabo-campaign__frame {
background-color: rgb(0 0 0 / 75%);
}
#campaign strong {
color: #FFE200;
}
/* tmp special movie
------------------------------------------------------------ */
.t-collabo-movie__group {
margin-top: 0px;
}
.t-collabo-movie__group-item {
max-width: 940px;
margin-right: auto;
margin-left: auto;
}
.t-collabo-movie__group-item + .t-collabo-movie__group-item {
margin-top: 150px;
}
.t-collabo-movie__iframe-wrap {
padding-bottom: 56.17%;
position: relative;
}
.t-collabo-movie__iframe-wrap iframe {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
@media screen and (max-width: 767px) {
.t-collabo-movie__group {
margin-top: 0px;
}
.t-collabo-movie__group-item {
margin-right: -12px;
margin-left: -12px;
}
.t-collabo-movie__group-item + .t-collabo-movie__group-item {
margin-top: 60px;
}
}
/* special movie
------------------------------------------------------------ */
.theme-dozle .t-collabo-movie {
background-image: url(https://www.pc-koubou.jp/wp/wp-content/uploads/2023/07/bg_6.jpg);
background-repeat: repeat-y;
background-size: 100% auto;
background-position: center;
}
.theme-dozle .t-collabo-movie .t-collabo__container {
padding-bottom: 105px;
}
h3.t-collabo__heading_movie-ja {
margin-top: 45px;
text-align: center;
font-size: 30px;
font-size: 3.0rem;
font-weight: 700;
letter-spacing: .039em;
margin-top: 0px;
margin-bottom: 45px;
}
.t-collabo_movie_heading-ja {
margin-top: 55px;
text-align: center;
font-size: 30px;
font-size: 3.0rem;
font-weight: 700;
letter-spacing: .039em;
margin-bottom: 45px;
}
@media screen and (max-width: 767px){
h3.t-collabo__heading_movie-ja {
margin-top: 25px;
font-size: 20px;
font-size: 2.0rem;
line-height: 1.5;
}
.t-collabo_movie_heading-ja {
font-size: 2.0rem;
line-height: 1.5;
}
}
/* CM逕ｨ*/
h3.p-dozle__content-heading_campaign {
line-height: 30px;
}
/*features__container*/
/*
.features__container {
margin: 80px 150px;
background: #ffffff;
border: 16px #f2f2f2 dashed;
box-shadow: 0px 0px 0px 20px rgb(255 255 255 / 45%);
background-size: 86px 4px;
outline-offset: -20px;
border-radius: 18px;
box-sizing: border-box;
outline: 20px solid #ffffff;
outline-offset: -10px;
}*/
.features__container {
margin: 80px auto;
background: #ffffff;
box-shadow: rgba(0, 0, 0, 0.3) 5px 5px 3px 2px;
background-size: 86px 4px;
outline-offset: -20px;
/*border-radius: 18px;*/
box-sizing: border-box;
width: 1603px;
}
@media screen and (max-width: 1603px) {
.features__container {
margin: 40px 0px;
padding: 0px 20px 0px 20px;
box-shadow:unset;
border-radius: 18px;
width: auto;
}
}
div.t-collabo__heading-right {
top: 50%;
transform: translateY(-50%);
transform-origin: center;
position: absolute;
right: -100px;
transform-origin: right bottom;
}
div#features {
background: #ffffff;
}
.features__container.red {
border: 15px #960000 outset;
}
#special .features__container.red {
border: 15px #960000 outset;
}
.features__container.purple {
border: 15px #572a74 outset;
}
.features__container.yellow {
border: 15px #d09600 outset;
}
.features__container.blue {
border: 15px #0d95d6 outset;
}
.features__container.pink {
border: 15px #e5417c outset;
}
@media screen and (max-width: 1240px) {
.features__container.red ,
#special .features__container.red ,
.features__container.purple ,
.features__container.yellow ,
.features__container.blue ,
.features__container.pink {
/*border:unset;*/
border-width: 5px;
}
}
.p-dozle-feature01{
background: #E70012;
}
.p-dozle-feature02{
background: #733B92;
}
.p-dozle-feature03{
background: #fcc700;
}
.p-dozle-feature04{
background: #54c3f1;
}
.p-dozle-feature05{
background: #eb6d9a;
}
.p-dozle__content-heading.red {color:#960000}
.p-dozle__content-heading.purple {color:#572a74}
.p-dozle__content-heading.yellow {color:#d09600}
.p-dozle__content-heading.blue {color:#0d95d6}
.p-dozle__content-heading.pin {color:#e5417c}
.p-dozle-features__num.is-right.mini {
right: -160px;
width: 170px;
bottom: 10px;
margin-left: auto;
margin-right: auto;
}
.p-dozle-features__num.is-left.mini {
left: -150px;
width: 170px;
bottom: 10px;
margin-left: auto;
margin-right: auto;
}
@media screen and (max-width: 1603px) {
.p-dozle-features__num.is-right.mini img ,
.p-dozle-features__num.is-left.mini img
{width: 130px;height: auto}
}
#gallery h2.t-collabo__heading-ja {
color: #fff;
}
#color .p-dozle__content-heading {
color: #ffffff;
}
#about {
background: #f5f5f5;
}
#color {
background: url(https://www.pc-koubou.jp/wp/wp-content/uploads/2024/11/pc_dozle_color_bg_02.jpg);
background-size: cover;
}
#color .t-collabo__text {
color:#fff
}
#color .t-collabo-special__note {
color:#fff
}
#color .p-dozle__btn {
border: #fff solid 2px;
}
#special,
#campaign,
#special_panel {
background: #fafaff;
background: repeating-linear-gradient(135deg, #d20010, #d20010 50px, #e60012 20px, #e60012 100px);
background-attachment: fixed;
}
#features .t-collabo__heading {
padding-top: 50px;
}
@media screen and (max-width: 767px) {
#features .t-collabo__heading {
padding-top: 0px;
}
}
#color .features__container ,
#special .features__container {
box-shadow: 0px 0px 12px 10px #00000024;
}
#member .t-collabo__heading-ja {
color: #333;
}
/*360縲view*/
/* feature01 */
.p-dz-feature01 {
background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2022/12/bg_2.png");
background: #fff;
background: #edf0f480;
}
.p-dz-feature01__container::before {
top: 0;
bottom: 0;
left: 130px;
margin: auto;
}
.p-dz-feature01__heading {
text-align: center;
}
.p-dz-feature01__text {
text-align: center;
}
.p-dz-feature01-rotate .t-collabo-rotate-slides__group {
padding-bottom: 63.058%;
background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2024/11/feature01_circle.png");
background-repeat: no-repeat;
background-position: center bottom;
}
.p-dz-feature01-rotate .t-collabo-rotate-tabs__label {
color: #e60012 !important;
font-size: 20px;
font-size: 2.0rem;
text-shadow: none !important;
letter-spacing: .1em;
}
.p-dz-feature01-rotate .t-collabo-rotate-tabs__label-left::before, .p-dz-feature01-rotate .t-collabo-rotate-tabs__label-right::after {
background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2024/11/arrow_green.png");
}
.p-dz-feature01-rotate .t-collabo-rotate-slide01-dis {
width: 345px;
max-width: 100%;
}
.p-dz-feature01-rotate .t-collabo-rotate-slides-dis dt {
color: #e60012;
font-size: 12px;
font-size: 1.2rem;
font-weight: 500;
}
.p-dz-feature01-rotate .t-collabo-rotate-slides-dis dt span {
font-size: 20px;
font-size: 1.8rem;
letter-spacing: .1em;
font-weight: 800;
}
.p-dz-feature01-rotate .t-collabo-rotate-slides-dis dt span::before {
width: 32px;
height: 4px;
background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2024/11/dz_dotted.png");
background-size: 100% 100%;
transform: translateY(-50%);
left: -42px;
}
.p-dz-feature01-rotate .t-collabo-rotate-slides-dis dd {
margin-top: 5px;
font-size: 16px;
font-size: 1.6rem;
line-height: 1.875;
letter-spacing: .039em;
color: #333;
}
@media screen and (max-width: 767px) {
.p-dz-feature01 {
padding-top: 30px;
/*background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2022/12/d79966970d24e4f48dac4404544c733e.png");*/
}
.p-dz-feature01__container {
padding-top: 5px !important;
}
.p-dz-feature01__text {
text-align: left;
}
.p-dz-feature01-rotate .t-collabo-rotate-slides__group {
padding-bottom: 0;
margin: 0 -10px;
background-size: 100% auto;
}
.p-dz-feature01-rotate .t-collabo-rotate-slides-dis {
display: none;
}
.p-dz-feature01-rotate .t-collabo-rotate-tabs {
padding-top: 0;
position: static;
margin-top: 25px;
}
.p-dz-feature01-rotate .t-collabo-rotate-tabs__label {
font-size: 15px;
font-size: 1.5rem;
}
.p-dz-feature01-rotate .t-collabo-rotate-tabs__label-left::before, .p-dz-feature01-rotate .t-collabo-rotate-tabs__label-right::after {
width: 10px;
height: 15px;
}
.p-dz-feature01-rotate .t-collabo-rotate-tabs__label-left::before {
margin-right: 10px;
}
.p-dz-feature01-rotate .t-collabo-rotate-tabs__label-right::after {
margin-left: 10px;
}
}
/* rotate slides
------------------------------------------------------------ */
.t-collabo-rotate {
position: relative;
}
.t-collabo-rotate__input {
display: none;
}
.t-collabo-rotate-slides {
max-width: 860px;
margin: 0 auto;
}
.t-collabo-rotate-slides__group {
padding-bottom: 55.814%;
position: relative;
}
.t-collabo-rotate-slides__group-item {
width: 100%;
text-align: center;
position: absolute;
top: 0;
left: 0;
z-index: 1;
opacity: 0;
transition: .3s;
}
#feature01InputLeft90:checked ~ .t-collabo-rotate-slides #feature01SlideLeft90, #feature01InputLeft45:checked ~ .t-collabo-rotate-slides #feature01SlideLeft45, #feature01InputFront:checked ~ .t-collabo-rotate-slides #feature01SlideFront, #feature01InputRight45:checked ~ .t-collabo-rotate-slides #feature01SlideRight45, #feature01InputRight90:checked ~ .t-collabo-rotate-slides #feature01SlideRight90 {
opacity: 1;
}
.t-collabo-rotate-slides-dis {
padding-left: 40px;
position: absolute;
text-align: left;
}
.t-collabo-rotate-slides-dis dt {
font-size: 11px;
font-size: 1.1rem;
font-weight: 700;
}
.t-collabo-rotate-slides-dis dt span {
display: block;
position: relative;
font-size: 16px;
font-size: 1.6rem;
font-weight: 500;
letter-spacing: .025em;
}
.t-collabo-rotate-slides-dis dt span::before {
content: "";
display: block;
width: 24px;
height: 3px;
background-image: linear-gradient(-90deg, #FFF 50%, transparent 50%);
background-size: 6px 6px;
position: absolute;
top: 50%;
left: -35px;
transform: skewX(50deg) translateY(-50%);
}
.t-collabo-rotate-slides-dis dd {
margin-top: 10px;
margin-bottom: 0;
font-size: 14px;
font-size: 1.4rem;
line-height: 1.857;
letter-spacing: .025em;
}
.t-collabo-rotate-slides-dis dd + dt {
margin-top: 35px;
}
.t-collabo-rotate-slide01-dis {
top: 50%;
left: 77%;
transform: translateY(-50%);
}
.t-collabo-rotate-slides__discription {
width: 305px;
padding-left: 40px;
position: absolute;
text-align: left;
}
.t-collabo-rotate-slides__slide01-discription {
top: 50%;
left: 68%;
transform: translateY(-50%);
}
.t-collabo-rotate-slides__discription dt {
color: #e60012;
font-size: 11px;
font-size: 1.1rem;
}
.t-collabo-rotate-slides__discription dd + dt {
margin-top: 35px;
}
.t-collabo-rotate-slides__discription dt span {
content: attr(data-eng);
display: block;
position: relative;
font-family: 'Orbitron', sans-serif;
font-size: 16px;
font-size: 1.6rem;
font-weight: 500;
letter-spacing: .025em;
}
.t-collabo-rotate-slides__discription dt span::before {
content: "";
display: block;
width: 24px;
height: 3px;
background-image: linear-gradient(-90deg, #e60012 50%, transparent 50%);
background-size: 6px 6px;
position: absolute;
top: 50%;
left: -40px;
transform: skewX(50deg) translateY(-50%);
}
.t-collabo-rotate-slides__discription dd {
margin-top: 10px;
margin-bottom: 0;
}
.t-collabo-rotate-tabs {
display: flex;
justify-content: center;
margin: 0 -45px;
}
.t-collabo-rotate-tabs__item {
padding: 0 45px;
}
.t-collabo-rotate-tabs__label {
display: flex;
align-items: center;
margin-bottom: 0;
color: #FFF;
font-size: 16px;
font-size: 1.6rem;
font-weight: 500;
letter-spacing: .025em;
cursor: pointer;
transition: .3s;
}
.t-collabo-rotate-tabs__label-left::before, .t-collabo-rotate-tabs__label-right::after {
content: "";
display: inline-block;
width: 14px;
height: 20px;
background-image: url("https://www.pc-koubou.jp/wp/wp-content/uploads/2022/03/arrow.png");
background-size: contain;
background-position: center;
background-repeat: no-repeat;
vertical-align: middle;
}
.t-collabo-rotate-tabs__label-left::before {
margin-right: 20px;
transform: rotate(180deg);
}
.t-collabo-rotate-tabs__label-right::after {
margin-left: 20px;
}
#feature01InputLeft90:checked ~ .t-collabo-rotate-tabs .t-collabo-rotate-tabs__label[for="feature01InputLeft90"], #feature01InputLeft45:checked ~ .t-collabo-rotate-tabs .t-collabo-rotate-tabs__label[for="feature01InputLeft45"], #feature01InputFront:checked ~ .t-collabo-rotate-tabs .t-collabo-rotate-tabs__label[for="feature01InputFront"], #feature01InputRight45:checked ~ .t-collabo-rotate-tabs .t-collabo-rotate-tabs__label[for="feature01InputRight45"], #feature01InputRight90:checked ~ .t-collabo-rotate-tabs .t-collabo-rotate-tabs__label[for="feature01InputRight90"] {
color: #e60012;
text-shadow: 0 0 20px rgba(75, 234, 208, .8), 0 0 20px rgba(75, 234, 208, .8);
}
@media screen and (max-width: 1023px) {
.t-collabo-rotate-tabs {
margin: 0 -15px;
}
.t-collabo-rotate-tabs__item {
padding: 0 15px;
}
.p-gw-feature01__slides {
position: relative;
}
.p-gw-feature01__slides-group {
padding: 0;
margin: 0 -20px;
}
#feature01InputLeft90:checked ~ .t-collabo-rotate-slides #feature01SlideLeft90, #feature01InputLeft45:checked ~ .t-collabo-rotate-slides #feature01SlideLeft45, #feature01InputFront:checked ~ .t-collabo-rotate-slides #feature01SlideFront, #feature01InputRight45:checked ~ .t-collabo-rotate-slides #feature01SlideRight45, #feature01InputRight90:checked ~ .t-collabo-rotate-slides #feature01SlideRight90 {
position: relative;
}
.p-gw-feature01__slides-image {
padding-bottom: 25px;
}
.p-gw-feature01__slide-discription {
width: auto;
padding: 0 20px;
margin-top: 50px;
margin-bottom: 0;
position: static;
transform: translateY(0);
}
.p-gw-feature01__slide-discription dt span::before {
display: none;
}
.p-gw-feature01__slide-discription dd {
margin-top: 0;
}
.t-collabo-rotate-tabs {
width: 100%;
justify-content: space-between;
padding-top: 665px;
margin: 0;
position: absolute;
top: 0;
left: 0;
z-index: 2;
}
.t-collabo-rotate-tabs__item {
padding: 0;
}
.t-collabo-rotate-tabs__label-left::before, .t-collabo-rotate-tabs__label-right::after {
width: 6px;
height: 10px;
}
}
@media screen and (max-width: 640px) {
.p-gw-feature01__slide-discription dt {
font-size: 10px;
font-size: 1.0rem;
}
.p-gw-feature01__slide-discription dt span {
font-size: 12px;
font-size: 1.2rem;
}
.t-collabo-rotate-tabs {
padding-top: calc(100% + 40px + 15px);
}
.t-collabo-rotate-tabs__label {
font-size: 11px;
font-size: 1.1rem;
}
}
/*360*/
/* CAMPAIGN
------------------------------------------------------------ */
.p-collabo-campaign {
background: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(43, 15, 0, 1) 80%, rgba(0, 0, 0, 1) 100%);
background-size: 1920px 1080px;
background-repeat: no-repeat;
background-position: center;
}
.t-collabo-campaign__frame {
flex-wrap: wrap;
align-items: flex-start;
background: none;
border-color: #c4c4c4;
}
.p-collabo-campaign__heading {
color: #333333;
font-size: 30px;
font-size: 3.00rem;
font-weight: 700;
line-height: 1.6;
letter-spacing: .039em;
/*text-shadow: 0 0 15px #ccff0036;*/
}
.p-collabo-campaign-main {
width: 100%;
text-align: center;
}
.p-collabo-campaign-main__image {
max-width: 1020px;
margin: 0 auto 20px;
}
.p-collabo-campaign-main__heading {
color: #CEFF00;
font-size: 30px;
font-size: 3.0rem;
font-weight: 700;
letter-spacing: .039em;
text-shadow: 0 0 15px #ccff0036;
}
.p-collabo-campaign-list {
margin-top: 40px;
}
.p-collabo-campaign-list__group {
/*margin: -40px -15px 0;*/
}
.p-collabo-campaign-list__group-item {
display: flex;
padding: 40px 20px;
border-bottom: 1px solid #CEFF00;
}
.p-collabo-campaign-list__thumb {
flex-shrink: 0;
margin-right: 30px;
width:31%;
}
.p-collabo-campaign-list-text__heading {
color: #333333;
font-size: 26px;
font-size: 2.6rem;
font-weight: 700;
letter-spacing: .039em;
/*text-shadow: 0 0 15px #ccff0036;*/
}
.p-collabo-campaign-list-text__text {
margin-top: 20px;
font-size: 15px;
font-size: 1.5rem;
font-weight: 500;
line-height: 2.4;
letter-spacing: .039em;
color: #333333;
}
.p-collabo-campaign-list-text__row {
display: flex;
flex-wrap: wrap;
margin: 15px -5px -5px;
}
.p-collabo-campaign-list-text__row-item {
width: 50%;
padding: 5px;
}
.t-collabo-campaign__period {
margin-top: 15px;
}
.t-collabo-campaign__period-frame {
display: block;
width: 480px;
max-width: 100%;
text-align: center;
}
.t-collabo-campaign__btn-wrap {
max-width: 480px;
}
.p-collabo-campaign-note {
margin-top: 40px;
font-size: 12px;
font-size: 1.2rem;
font-weight: 400;
line-height: 2;
letter-spacing: 0;
color: #333333;
}
.p-collabo-campaign-influencer:not(:first-child) {
margin-top: 80px;
}
.p-collabo-campaign-influencer__heaidng {
text-align: center;
}
.p-collabo-campaign-influencer-list {
margin-top: 30px;
}
.p-collabo-campaign-influencer-list__group {
display: flex;
flex-wrap: wrap;
margin: -13px -40px;
margin-bottom: 40px;
}
.p-collabo-campaign-influencer-list__group-item {
width: 50%;
padding: 13px 40px;
}
.p-collabo-campaign-influencer-data {
display: flex;
align-items: flex-start;
}
.p-collabo-campaign-influencer-data__thumb {
display: flex;
flex-shrink: 0;
width: 200px;
border: 2px solid #CEFF00;
box-shadow: 0 0 15px #ccff0036;
position: relative;
margin-right: 40px;
}
.p-collabo-campaign-influencer-data__thumb::before {
content: "";
width: 100%;
height: 100%;
background-color: #CEFF00;
box-shadow: 0 0 15px #ccff0036;
position: absolute;
top: 10px;
left: 10px;
}
.p-collabo-campaign-influencer-data__thumb img {
position: relative;
z-index: 1;
vertical-align: bottom;
}
.p-collabo-campaign-influencer-data-text__belong {
color: #999;
font-size: 16px;
font-size: 1.6rem;
font-weight: 400;
letter-spacing: .02em;
}
.p-collabo-campaign-influencer-data-text__name {
display: flex;
align-items: center;
}
.p-collabo-campaign-influencer-data-text__name span {
margin-left: 20px;
font-size: 12px;
font-size: 1.2rem;
}
.p-collabo-campaign-influencer-data-text__text {
margin-top: 10px;
font-size: 15px;
font-size: 1.5rem;
font-weight: 500;
line-height: 2.4;
letter-spacing: .039em;
}
.p-collabo-campaign-influencer-sns {
margin-top: 30px;
}
.p-collabo-campaign-influencer-sns__group {
display: flex;
flex-wrap: wrap;
margin: -10px;
}
.p-collabo-campaign-influencer-sns__group-item {
width: 50%;
padding: 10px;
}
.p-collabo-campaign-movie:not(:first-child) {
/*margin-top: 80px;*/
margin-bottom: 80px;
}
.p-collabo-campaign-movie__heading {
text-align: center;
}
.p-collabo-campaign-movie-iframe {
width: 100%;
max-width: 1100px;
margin: 30px auto 0;
text-align: center;
}
.p-collabo-campaign-movie-iframe__inner {
width: 100%;
padding-bottom: 56.17%;
box-shadow: 0 0 50px rgba(255, 255, 255, .4);
position: relative;
}
.p-collabo-campaign-movie-iframe__inner iframe {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.p-collabo-campaign-list__group-item {
display: flex;
padding: 40px 0px;
border-bottom: 1px solid #c4c4c4;
}
@media screen and (max-width: 1023px) {
.t-collabo-campaign__frame {
flex-direction: column;
}
.p-collabo-campaign-list__group-item {
flex-direction: column;
padding: 40px 0px;
}
.p-collabo-campaign-list__thumb {
margin: 0 auto 20px;
}
.p-collabo-campaign-list-text__row-item {
width: 100%;
}
}
@media screen and (max-width: 767px) {
.t-collabo-campaign__frame {
padding-bottom: 15px;
}
.p-collabo-campaign__heading {
text-align: center;
font-size: 15px;
font-size: 1.8rem;
padding-top: 25px;
}
.p-collabo-campaign-main__image {
margin-bottom: 10px;
}
.p-collabo-campaign-list__thumb {
width:100%;
text-align:center;
}
.p-collabo-campaign-list {
margin-top: 20px;
}
.p-collabo-campaign-list__group {
margin: -20px 0 0;
}
.p-collabo-campaign-list-text__heading {
text-align: center;
font-size: 15px;
font-size: 1.5rem;
}
.p-collabo-campaign-list-text__text {
margin-top: 10px;
font-size: 11px;
font-size: 1.1rem;
}
.t-collabo-campaign__period {
margin-top: 10px;
}
.t-collabo-campaign__period-frame {
width: 100%;
}
.p-collabo-campaign-note {
margin-top: 20px;
font-size: 10px;
font-size: 1.0rem;
}
.p-collabo-campaign-influencer:not(:first-child) {
margin-top: 30px;
}
.p-collabo-campaign-influencer-list {
margin-top: 15px;
}
.p-collabo-campaign-influencer-list__group-item {
width: 100%;
}
.p-collabo-campaign-influencer-data__thumb {
width: 100px;
margin-right: 20px;
}
.p-collabo-campaign-influencer-data__thumb::before {
top: 5px;
left: 5px;
}
.p-collabo-campaign-influencer-data-text__belong {
font-size: 10px;
font-size: 1.0rem;
}
.p-collabo-campaign-influencer-data-text__name {
text-align: left;
}
.p-collabo-campaign-influencer-data-text__name span {
font-size: 10px;
font-size: 1.0rem;
}
.p-collabo-campaign-influencer-data-text__text {
margin-top: 5px;
font-size: 10px;
font-size: 1.0rem;
}
.p-collabo-campaign-influencer-sns {
margin-top: 15px;
}
.p-collabo-campaign-influencer-sns__group {
margin: -5px;
}
.p-collabo-campaign-influencer-sns__group-item {
padding: 5px;
}
.p-collabo-campaign-influencer-sns .p-collabo__btn {
padding-top: 10px;
padding-bottom: 10px;
}
.p-collabo-campaign-movie:not(:first-child) {
margin-top: 30px;
margin-bottom: 40px;
}
.p-collabo-campaign-movie-iframe {
margin-top: 15px;
}
label.tab_label {
top: 50px;
}
.tab_01,.tab_02 {height: auto;
}
}
.t-collabo-spec__table td .white a {
color: #fff!important;
}
.t-collabo-spec__table td a :hover {
opacity: 0.9;
}
.p-dozle-panel__btn-wrap {
width: 100%;
}
p.p-collabo-special-note {
margin-top: 40px;
font-size: 30px;
font-size: 3rem;
font-weight: 600;
line-height: 2;
letter-spacing: 0;
color: #e50012;
border: 2px solid #ff3c4b;
padding: 10px 55px 10px 65px;
background: #fff7f7;
text-align: center;
border-left: none;
border-right: none;
width: 100%;
}
@media screen and (max-width: 767px) {
p.p-collabo-special-note {
font-size: 25px;
font-size: 2rem;
padding: 10px 10px;
line-height: 1.5;
margin-top: 15px;
}
}
p.p-collabo-special-note2 {
margin-top: 40px;
font-size: 12px;
font-size: 1.2rem;
font-weight: 400;
line-height: 2;
letter-spacing: 0;
color: #333333;
/* border: 1px solid #c4c4c4; */
padding: 10px 45px 10px 45px;
margin: 10px 65px 0px 65px;
background: #f5f5f5;
text-align: center;
}
@media screen and (max-width: 767px) {
p.p-collabo-special-note2 {
font-size: 10px;
margin: 0;
}
}
span.t-collabo-campaign__period-frame.web_coupon {
border-radius: 0;
background: #000;
color: #fff;
/* width: fit-content; */
font-size: 15px;
font-weight: 600;
}
p.p-collabo-campaign-note a {
color: #c80000;
}
p.SJ-items__none--title {
color: #000 !important;
}
/*繧ｲ繝ｼ繝溘Φ繧ｰPC縺ｮ驕ｸ縺ｳ譁ｹ*/
.p-select_container {
display: block;
width: 1603px;
border: 6px solid #c80000;
border-radius: 15px;
padding: 40px;
margin: 50px auto;
color: #000;
box-shadow: 0 0 10px #00000042;
@media screen and (max-width: 768px){
width: auto;
border: 3px solid #c80000;
padding: 20px;
margin: 10px;
}
}
.p-select_container2 {
display: block;
width: 34%;
border-radius: 15px;
@media screen and (max-width: 768px){
width: auto;
}
}
.p-select_flexbox {
display: flex;
gap: 50px;
justify-content: center;
/* margin-bottom: 30px; */
padding: 70px;
position: relative;
@media screen and (max-width: 768px){
gap: 40px;
padding: 0px;
flex-direction: column;
margin-bottom: 30px;
}
}
.p-select_container2 h3 {
text-align: center;
border-bottom: 3px solid #f7bfbf;
padding-bottom: 20px;
font-size: 30px;
height: 80px;
display: flex;
justify-content: center;
align-content: center;
align-items: center;
color: #c80000;
line-height: 120%;
}
.p-select_comment {
background: #fbdfdf;
border-radius: 15px;
padding: 30px 150px 30px 50px;
font-size: 15px;
display: flex;
justify-content: center;
align-items: center;
line-height: 130%;
margin: 0 50px 50px;
position: relative;
@media screen and (max-width: 768px){
padding: 20px 60px 20px 20px;
margin: 0;
}
}
.p-select_container2 p {
padding: 10px 5px;
font-size: 15px;
line-height: 180%;
position: relative;
}
.p-select_comment p {
font-size: 16px;
font-weight: 500;
line-height: 150%;
@media screen and (max-width: 768px){
font-size: 15px;
}
}
.p-select_flexbox2 {
display: flex;
width: 1730px;
border-radius: 15px;
margin: 20px auto 100px;
gap: 20px;
justify-content: center;
color: #000;
@media screen and (max-width: 768px){
width: unset;
margin: 10px;
flex-direction: column;
}}
.p-select_container3 {
border: 3px solid #c80000;
display: block;
width: 30%;
border-radius: 15px;
padding: 20px;
position: relative;
box-shadow: 0 0 10px #00000042;
@media screen and (max-width: 768px){
width: auto;
margin: auto;
}}
.p-select_container3 h3 {
text-align: center;
font-size: 27px;
line-height: 120%;
padding: 15px 0;
color: #c80000;
position: relative;
border-bottom: 3px solid #fff;
margin: 0px 10px;
}
.p-select_container3 p {
font-size: 15px;
line-height: 130%;
padding: 10px 15px;
height: 130px;
line-height: 180%;
}
.p-select_comment2 {
border-radius: 15px;
padding: 20px 30px 20px 20px;
display: flex;
justify-content: center;
align-items: center;
line-height: 130%;
background: #fbdfdf;
margin: -10px 0 30px;
width: 92%;
font-weight: 500;
@media screen and (max-width: 768px){
width: 100%;
padding: 20px 20% 20px 20px;
margin-top: 10px;
}}
@media screen and (max-width: 768px){
.p-select_comment2.blue{
padding: 20px 20px 20px 20%;
}}
.p-select_comment2 p {
padding: 0;
height: auto;
line-height: 150%;
}
.p-select_pc_bg {
height: 300px;
background: #c80000;
border-radius: 15px;
display: flex;
justify-content: center;
align-items: center;
gap: 50px;
position: relative;
@media screen and (max-width: 768px){
justify-content: unset;
align-items: unset;
gap: 0;
flex-direction: column;
margin-bottom: 50px;
}}
.p-select-pc_text {
color: #fff;
font-size: 70px;
font-weight: 800;
@media screen and (max-width: 768px){
font-size: 24px;
padding: 20px 0 0 20px;
z-index: 2;
}}
.p-select-pc_text p:last-child {
font-size: 30px;
@media screen and (max-width: 768px){
font-size: 9px;
}}
@media screen and (max-width: 768px){
.p-select-pc_img {
width: 210px;
margin-left: 20%;
z-index: 1;
margin-top: -7%;
}
.purple .p-select-pc_img {
margin-left: auto;
margin-right: auto;
}
}
.p-select_comment div {
position: absolute;
right: -6%;
width: 150px;
@media screen and (max-width: 768px){
right: -9%;
width: 100px;
}}
@media screen and (max-width: 768px){
.p-select_comment.purple div{
left: -12%;
}
.p-select_comment2.blue div{
left: -4%;
}
}
.p-select_container.purple {
border-color: #733c93;
}
.p-select_pc_bg.purple {
background-color: #733c93;
}
.p-select_container2.purple h3 {
color: #733c93;
}
.p-select_flexbox.purple .p-select_container2 h3 {
color: #733c93;
border-color: #e7ddec;
}
.p-select_comment.purple {
background-color: #e7ddec;
@media screen and (max-width: 768px){
padding: 20px 20px 20px 60px;
}}
.p-select_container3.yellow {
border-color: #fcc700;
}
.p-select_container3.yellow h3 {
color: #fcc700;
border-color:#fff5c9;
}
.p-select_comment2.yellow {
background: #fff5c9;
}
.p-select_container3.blue {
border-color: #54c3f1;
}
.p-select_container3.blue h3 {
color: #54c3f1;
border-color: #d6effb;
}
.p-select_comment2.blue {
background: #d6effb;
}
.p-select_container3.pink {
border-color: #eb6d9a;
}
.p-select_container3.pink h3 {
color: #eb6d9a;
border-color: #fae3ed;
}
.p-select_comment2.pink {
background: #fae3ed;
}
.p-select_comment2 div {
position: absolute;
right: -36px;
width: 150px;
bottom: -75px;
z-index: 2;
@media screen and (max-width: 768px){
width: 100px;
right: -3%;
bottom: unset;
}}
.p-select_pc_bg:before {
content: "";
display: inline-block;
background-image: url(https://www.pc-koubou.jp/wp/wp-content/uploads/2025/04/pc_game_dozle_select_bg.png);
position: absolute;
left: 15px;
top: 15px;
width: 100%;
height: 100%;
margin-left: auto;
background-repeat: no-repeat;
z-index: 0;
}
@media screen and (max-width: 768px){
.p-select_pc_bg:before {
display: none;
}
}
.p-select_pc_bg:after {
content: "";
background-image: url(https://www.pc-koubou.jp/wp/wp-content/uploads/2025/04/pc_game_dozle_select_bg.png);
position: absolute;
right: 15px;
bottom: 15px;
width: 100%;
height: 100%;
margin-right: auto;
background-repeat: no-repeat;
transform: rotate(-180deg);
z-index: 0;
}
.p-select_container2:first-child::before {
content: "縺翫☆縺吶ａ繝昴う繝ｳ繝�";
display: inline-block;
background: #c80000;
height: 100px;
width: 100px;
border-radius: 50%;
position: absolute;
padding: 23px 10px 20px 10px;
font-size: 18px;
font-weight: 800;
color: #fff;
position: absolute;
top: 20px;
left: -25px;
transform: rotate(-15deg);
line-height: 150%;
text-align: center;
letter-spacing: -1px;
box-shadow: 0px 0px 1px 1px #c80000;
}
@media screen and (max-width: 768px){
.p-select_container2:first-child::before {
height: 60px;
width: 60px;
padding: 15px 10px 20px 10px;
font-size: 11px;
top: -40px;
left: -10px;
}}
.purple .p-select_container2:first-child::before {
background: #733c93;
box-shadow: 0px 0px 1px 1px #733c93;
}
h2.t-collabo-select__heading-ja {
padding-top: 100px;
text-align: center;
font-size: 30px;
font-size: 5rem;
font-weight: 800;
letter-spacing: .039em;
color: #c80000;
@media screen and (max-width: 768px){
font-size: 28px;
padding: 50px 0 20px 0;
}}
#select .p-dozle-color__btn-wrap {
margin-bottom: 50px;
@media screen and (max-width: 768px){
width: calc(100% - 20px);
margin-left: auto;
margin-right: auto;
}}
/*//繧ｲ繝ｼ繝溘Φ繧ｰPC縺ｮ驕ｸ縺ｳ譁ｹ*/