body {
font-family: 'Noto Sans JP', sans-serif;
}
.--sp-only{
display: none!important;
}
.--pc-only{
display: initial!important;
}
.--w100 {
width: 100%;
}
.--pcw70 {
width: 70%;
}
.--pcw48 {
width: 48%;
}
.--pcw35 {
width: 35%;
}
/* 繝�く繧ｹ繝医�陬�｣ｾ */
.--strike{
text-decoration: line-through;
}
.--highlight{
background-color: #FFFF99;
}
.--underline{
text-decoration:underline;
}
.--link{
color:#D06AA5;
text-decoration: underline;
}
.--link.--external::after{
content: url("https://gigaplus.makeshop.jp/raffiria/img/icon/external-link.svg");
margin-left: 10px;
}
.--emphasis{
font-weight: bold;
}
.--color-pink{
color:#D06AA5;
}
.--color-pale-navy{
color:#616588;
}
.--color-navy{
color:#1F3058;
}
.--color-grey {
color: #BFC0C0;
}
.--color-green {
color: #3EA284;
}
.--jumbo {
font-size: 1.7rem;
}
.--huge {
font-size: 1.3rem;
}
.--large {
font-size: 1.1rem;
}
.--medium {
font-size: 1rem;
font-weight: 400;
}
.--small {
font-size: 0.8rem;
font-weight: 400;
}
.--serif {
font-family: 'Noto Serif JP', serif;
}
/* 繝｡繧､繝ｳ繝薙ず繝･繧｢繝ｫ */
.main-visual img {
width: 100%;
object-fit: cover;
margin: 0 auto 2em;
max-width: 100%;
}
/* 蠑慕畑譁��陬�｣ｾ */
.Quote{
position: relative;
padding: 10px 60px;
box-sizing: border-box;
font-style: inherit;
background: #efefef;
color: #555;
}
.Quote__sentence {
padding: 0;
margin: 10px 0;
line-height: 1.7;
}
.Quote__sentence:before{
display: inline-block;
position: absolute;
top: 10px;
left: -0.3em;
content: "窶�";
font-family: monospace;
color: #cfcfcf;
font-size: 90px;
line-height: 1;
}
.Quote__sentence:after{
display: inline-block;
position: absolute;
right: -0.3em;
content: "窶�";
font-family: monospace;
color: #cfcfcf;
font-size: 90px;
}
.Quote__source{
display: block;
text-align: right;
margin-right: 1em;
color: #888888;
font-size: 0.9em;
}
/* 繧ｭ繝｣繝�メ繧ｳ繝斐�縺ｨ繝ｪ繝ｼ繝画枚 */
.Headline {
margin-bottom: 5em;
position: relative;
}
.Headline {
font-family: 'Noto Serif JP', serif;
}
/* PC繝ｻ繧ｿ繝悶Ξ繝�ヨ驕ｩ蠢� */
@media screen and (min-width: 769px){
.Headline.--w60 {
width: 60%;
}
.Headline.--w40 {
width: 40%;
}
.section2-flex {
display: flex;
}
.section2-flex.--w60 {
width: 60%;
}
.section2-flex.--w40 {
width: 40%;
}
}
/* 繧ｭ繝｣繝�メ繧ｳ繝斐� */
.Headline__title {
margin-bottom: 0.8em;
line-height: 1.3;
font-weight: 400;
}
.Headline__title.--jumbo {
font-size: 3rem;
}
.Headline__title.--huge {
font-size: 2.2rem;
}
.Headline__title.--large {
font-size: 1.6rem;
font-weight: 500;
}
.Headline__title.--medium {
font-size: 1.2rem;
font-weight: 500;
}
.Headline__title.--small {
font-size: 1rem;
font-weight: 700;
}
/* 繝ｪ繝ｼ繝画枚 */
.Headline__lead {
margin-bottom: 1em;
line-height: 1.6;
}
.Headline__lead.--jumbo {
font-size: 1.7rem;
}
.Headline__lead.--huge {
font-size: 1.3rem;
}
.Headline__lead.--large {
font-size: 1.1rem;
}
.Headline__lead.--medium {
font-size: 1rem;
font-weight: 400;
}
.Headline__lead.--small {
font-size: 0.8rem;
font-weight: 400;
}
/* 荳闊ｬ逧�↑譁�ｫ�繧ｻ繝�ヨ */
.Section {
margin-bottom: 2em;
}
.Section.--margin-bottom-headline {
margin-bottom: 5em;
}
/* 隕句�縺� */
.Section__title {
margin-top: 2em;
margin-bottom: 0.6em;
line-height: 1.1;
font-weight: 400;
}
.Section__title.--jumbo {
font-size: 1.6rem;
padding: 0.6em 1em;
background: #BFC0C0;
}
.Section__title.--huge {
font-size: 2.2rem;
padding-bottom: 0.2em;
border-bottom: 2px solid #BFC0C0;
}
.Section__title.--large {
font-size: 1.6rem;
font-weight: 500;
padding-left: 0.5em;
border-left: 4px solid #BFC0C0;
}
.Section__title.--medium {
font-size: 1.2rem;
font-weight: 500;
}
.Section__title.--small {
font-size: 1rem;
font-weight: 500;
}
.Section__title.--margin-top-none {
margin-top: 0.5em;
}
/* 譛ｬ譁� */
.Section__sentence {
margin-bottom: 1em;
}
/* 繝槭�繧ｸ繝ｳ縺ｪ縺� */
.Section.Section__without-break,
.Section__sentence.Section__without-break,
.Headline.Section__without-break,
.Cols.Section__without-break,
.Section__without-break {
margin-bottom: 0;
}
/* 繧ｫ繧ｦ繝ｳ繧ｿ繝ｼ */
body {
counter-reset: title_number 0;
}
.Section__title.--order:before {
content: "Raffiria SPECIAL ";
color: #1E1E1E;
}
/* 繝ｪ繧ｹ繝� */
.List {
margin-bottom: 1em;
}
.List.--order{
counter-reset: list_number 0;
}
.List__item.--order{
padding-left: 1.5em;
text-indent: -1.5em;
}
.List__item.--order:before {
counter-increment: list_number 1;
content: counter(list_number) " ";
margin-right: 14px;
}
.List.--order-circled {
counter-reset: my_counter;
}
.List__item.--order-circled{
position: relative;
margin-left: 1.5em;
padding-left: 0.5em;
}
.List__item.--order-circled:before{
position: absolute;
top: 2px;
content: counter(my_counter);
counter-increment: my_counter;
width: 15px; height: 15px;
line-height: 16px;
left: -1.5em;
text-align: center;
font-size: 12px;
font-weight: bold;
border: 1px solid black;
border-radius: 50%;
}
.List__item.--links{
position:relative;
margin-left: 20px;
padding-left: 1.5em;
text-indent: -1.5em;
color:#D06AA5;
}
.List__item.--links:before {
content: ' ';
position: absolute;
top: 7px;
left: -20px;
display: block;
width: 8px;
height: 8px;
border: 0px;
border-top: solid 2px #CC4C80;
border-right: solid 2px #CC4C80;
transform: rotate(45deg);
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
.List__item.--disc{
padding-left: 1.5em;
text-indent: -1.5em;
}
.List__item.--disc:before {
content: '\25CF';
position: relative;
top: -2px;
font-size: 1px;
color: #D06AA5;
margin-right: 14px;
}
.List__item.--note{
padding-left: 1.5em;
text-indent: -1.5em;
}
.List__item.--note:before {
content: "窶ｻ";
margin-right: 10px;
}
.List__item.--checked{
position:relative;
padding: 0em 1em 0em 1.5em;
text-indent: 0;
}
.List__item.--checked:before,
.List__item.--checked:after{
content:'';
position:absolute;
top: 7px;
left: 8px;
height: 16px;
width:3px;
background: #D06AA5;
/* border-radius:10px; */
transform:rotate(45deg);
-webkit-transform:rotate(45deg);
-o-transform:rotate(45deg);
}
.List__item.--checked:after{
top: 12px;
left: 0px;
height: 8px;
transform:rotate(-45deg);
-webkit-transform:rotate(-45deg);
-o-transform:rotate(-45deg);
}
/* 讓ｪ荳ｦ縺ｳ縺ｮ驟榊� */
.Cols{
display: flex;
flex-wrap: wrap;
margin-left: -.75rem;
margin-right: -.75rem;
margin-bottom: 2em;
}
.Cols__col{
display: block;
flex-basis: 0;
flex-grow: 1;
flex-shrink: 1;
padding: .75rem;
}
/* 讓ｪ荳ｦ縺ｳ縺ｮ驟榊� */
.Cols-inline{
display: flex;
flex-wrap: wrap;
margin-bottom: 1em;
}
.Cols-inline__col{
display: inline-block;
position: relative;
margin-right: 2em;
}
/* 繧ｻ繝ｳ繧ｿ繝ｼ驟咲ｽｮ */
.Section-center{
display: flex;
align-items: flex-start;
justify-content: center;
margin-bottom: 2em;
line-height: 1.8;
}
.foot {
position: relative;
}
.foot .Section-sns{
position: absolute;
top: -100px;
left: 0;
width: 100%;
display: flex;
align-items: flex-start;
justify-content: center;
}
/* 逕ｻ蜒上→繝�く繧ｹ繝医�驟咲ｽｮ */
.Section-row{
display: flex;
align-items: flex-start;
margin-bottom: 4em;
line-height: 1.8;
}
.Section-row__img{
width: 100%;
}
.Section__img.--pull-left{
margin-right: 1em;
}
.Section__img.--pull-right{
margin-left: 1em;
}
.-reverse{
flex-direction: row-reverse;
}
.Profile{
display: flex;
background-color: #F1F1F1;
margin-bottom: 3em;
padding: 1em;
}
.Profile__name{
margin-bottom: 1em;
}
.Profile__content{
margin-left:1em;
}
/* 驟埼√↓縺､縺�※ */
.Message.--info{
background-color: #e1eefa;
margin-bottom: 2em;
padding: 20px;
}
.Message.--warning{
background-color: #faf7be;
margin-bottom: 2em;
padding: 20px;
}
.Message.--danger{
background-color: #ebc4db;
margin-bottom: 2em;
padding: 20px;
}
.Message__title{
display: flex;
align-items: flex-start;
margin-top: 0;
margin-bottom: 1em;
}
.Message__title-img{
margin-right: 1em;
}
.--colored{
color: #CC4C80;
}
.Message__content.--note{
padding:20px;
margin-bottom: 2em;
background-color: #ebebeb;
}
/* 繝��繝悶Ν */
.Table{
margin-bottom: 30px;
border-top: 1px solid #000;
}
.Table__col-head, .Table__row-head, .Table__col-body {
padding: 1em;
}
.Table.--fullwidth{
width:100%;
}
.Table__row{
border-bottom: 1px solid #000;
}
.Table__row.--main{
border-bottom: 1px dotted #727171;
}
.Table__col-head.--rowspan{
border-right: 1px solid #000;
}
.Table__col-head.--horizontal{
background-color: #ededed;
}
.Table__row-head.--vertical{
background-color: #727171;
color: #fff;
}
.Table__col-head.--horizontal, .Table__col-body.--horizontal{
vertical-align: middle;
}
.Table__col-head.--center, .Table__col-body.--center{
text-align: center;
}
.Table__col-head.--left, .Table__col-body.--left{
text-align: left;
}
.Table__col-head.--right, .Table__col-body.--right{
text-align: right;
}
/* 繧ｫ繝ｼ繝� */
.Card {
max-width: 100%;
position: relative;
line-height: 0;
}
.Card__image {
display: block;
position: relative;
}
.Card__image img {
height: 100%;
width: 100%;
}
.Card__body {
line-height: 1.3;
}
.Card__body.--overlay {
position: absolute;
bottom: 0;
background: rgba(0,0,0,0.8);
color: white;
width: 100%;
}
.Card__caption {
padding: 10px;
line-height: 1.3;
}
/* 繝輔か繝ｼ繝� */
.Field{
display: flex;
}
.Field__label{
vertical-align: top;
}
.Field__textarea{
width:80%;
margin-bottom: 2em;
}
/* 繝懊ち繝ｳ */
.btn a {
color:#fff;
}
.btn span{
color: #000;
}
.btn__cart-back{
display: block;
font-size: 14px;
font-weight: bold;
text-align: center;
background-color: #999;
border-radius: 5px;
padding: 20px 0px;
}
.item-detail-addcart .btn__cart-instock-on{
display: block;
/* font-size: 14px; */
font-weight: bold;
text-align: center;
border-radius: 5px;
padding: 20px 0px;
background-color: #CC4C80;
border-color: #CC4C80;
}
.item-detail-addcart .btn__cart-instock-on:hover {
color: #CC4C80;
border: 3px solid #CC4C80;
background: inherit;
}
.cart-buy-button .btn__cart-buy{
display: block;
font-size: 14px;
font-weight: bold;
text-align: center;
border-radius: 5px;
background-color: #1F3058;
/* padding: 20px 0px; */
}
.btn__item-detail-soldout{
display: block;
font-size: 14px;
font-weight: bold;
text-align: center;
border-radius: 5px;
padding: 20px 0px;;
background-color: #F1F1F1;
}
.btn__item-view{
width: 48%;
display: block;
font-size: 14px;
font-weight: bold;
text-align: center;
border-radius: 5px;
padding: 20px 0px;;
background-color: #999;
}
.btn__item-delete{
width:25%;
display: block;
font-size: 14px;
font-weight: bold;
text-align: center;
border-radius: 5px;
padding: 20px 0px;;
background-color: #999;
}
/* 繧ｿ繧ｰ */
.Tags{
font-size: 10px;
display: inline;
align-items: center;
width: 25%;
font-size: 10px;
}
.Tags__new{
background-color: #D06AA5;
color: #fff;
padding: 3px 10px;
border-radius: 3px;
}
.Tags__new-color{
color: #D06AA5;
border: 2px solid #D06AA5;
border-radius: 3px;
padding: 1px 10px;
}
.Tags__update{
background-color: #616588;
color: #fff;
padding: 3px 10px;
border-radius: 3px;
}
.Tags__text{
border: 2px solid #727171;
border-radius: 3px;
padding: 1px 10px;
display: inline-block;
line-height: 1.3;
margin-bottom: 0.5em;
}
.Tags__sek{
vertical-align: middle;
width: 36px;
}
/* 繝壹�繧ｸ繝｣繝ｼ */
.pager-list a{
width: fit-content;
background-color: #CC4C80;
border-radius: 5px;
color:#fff;
}
.news-pager li{
position: relative;
}
.news-pager li.prev{
margin-left: 20px;
}
.news-pager li.prev a{
margin-left: 10px;
}
.news-pager li.prev:before{
content: ' ';
position: absolute;
top: 5px;
left: -10px;
display: block;
width: 14px;
height: 14px;
border: 0px;
border-top: solid 1px #CC4C80;
border-right: solid 1px #CC4C80;
transform: rotate(-135deg);
-ms-transform: rotate(-135deg);
-webkit-transform: rotate(-135deg);
}
.news-pager li.next{
margin-right: 20px;
}
.news-pager li.next a{
margin-right: 10px;
}
.news-pager li.next:after{
content: ' ';
position: absolute;
top: 5px;
right:-9px;
display: block;
width: 14px;
height: 14px;
border: 0px;
border-top: solid 1px #CC4C80;
border-right: solid 1px #CC4C80;
transform: rotate(45deg);
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
/* 繧ｹ繝槭�蟇ｾ蠢� */
@media screen and (max-width: 768px){
.Section-row,
.Profile{
display: block;
}
/* 逕ｻ蜒上�驟咲ｽｮ */
.Section__img.--pull-right img,
.Profile__img.--pull-right img,
.Section__img.--pull-left img,
.Profile__img.--pull-left img,
.Card__image img{
width: 100%;
height: auto;
}
.Section__img.--pull-left{
margin-right: 0;
}
.Section__img.--pull-right{
margin-left: 0;
}
/* 讓ｪ荳ｦ縺ｳ縺九ｉ邵ｦ荳ｦ縺ｳ縺ｸ驟咲ｽｮ */
.Cols{
display: block;
}
/* 繝��繝悶Ν */
.Table.--vertical{
min-width: max-content;
}
/* 繧ｹ繝槭�逕ｨ縺ｫ譛驕ｩ蛹悶☆繧九ユ繝ｼ繝悶Ν */
.Table.--rebuild-mobile-view {
width: 90%;
border: none;
}
.Table.--rebuild-mobile-view thead {
display: none;
}
.Table.--rebuild-mobile-view .Table__row {
width: 100%;
border: none;
}
.Table.--rebuild-mobile-view th,
.Table.--rebuild-mobile-view td {
display: block;
width: 100%;
border-bottom: 1px solid #000;
}
.Table.--rebuild-mobile-view th {
text-align: center;
}
.Table.--rebuild-mobile-view th:first-child {
background: #727171;
color: #fff;
text-align: center;
}
.Table.--rebuild-mobile-view .--sub th {
background-color: #ededed;
color: inherit;
}
.Table.--rebuild-mobile-view td:before {
content: attr(data-label);
float: left;
font-weight: bold;
margin-right: 10px;
}
/* 繝輔か繝ｼ繝� */
.Field__input-zip{
width: 50%;
}
/* btn */
.btn__item-view{
width: 100%;
}
}
/* ------------------------------------------------------------
繧ｫ繝�ざ繝ｪ蛻･荳隕ｧ
------------------------------------------------------------ */
.section-title{
text-align: center;
font-size: 36px;
font-weight: 300;
margin: 50px 0 50px;
position: relative;
}
.section-title:after{
content: "";
width: 25px;
height: 3px;
position: absolute;
top: 70px;
left: 50%;
margin-left: -10px;
border-top: solid 1px #BFC0C0;
border-bottom: solid 1px #BFC0C0;
}
.section-title-categoryitems{
text-align: left;
margin: 0;
padding: 0;
height: 160px;
/* background: #BFC0C0 top center; */
background-size: cover;
line-height: 1;
}
.section-title-categoryitems:after {
border: none;
}
.section-title--inner {
max-width: 1050px;
margin: 0 auto;
padding: 50px 0 50px;
position: relative;
/* color: #fff; */
font-size: 1.3em;
}
.rf03_00 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/all_items.jpg);
}
.rf03_01 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20230401/andcolor_pc.jpg);
}
.rf03_02 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20230401/botanical-garden_pc.jpg);
}
.rf03_03 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20230401/ath-medical_pc.jpg);
}
.rf03_04 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20250301/couturelook_pc.jpg);
}
.rf03_05 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/noble-navy.jpg);
}
.rf03_06 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20230401/stylish-scrub_pc.jpg);
}
.rf03_07 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20250301/doctorcoat_pc.jpg);
}
.rf03_08 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20230401/basic-lineup_pc.jpg);
}
.rf03_09 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20230401/medical-pants_pc.jpg);
}
.rf03_10 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20230401/work-style-reform_pc.jpg);
}
.ct27 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/hogara-shorts.jpg);
}
.ct51 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20250301/champion_pc.jpg);
}
.ct52 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20250301/colorfastscrub_pc.jpg);
}
.ct66 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20250301/@Museum_pc.jpg);
}
.ct67 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20250301/wellbescrub_pc.jpg);
}
.rf03_00 .section-title-categoryitems,
.rf03_01 .section-title-categoryitems,
.rf03_02 .section-title-categoryitems,
.rf03_03 .section-title-categoryitems,
.rf03_04 .section-title-categoryitems,
.rf03_05 .section-title-categoryitems,
.rf03_06 .section-title-categoryitems,
.rf03_07 .section-title-categoryitems,
.rf03_08 .section-title-categoryitems,
.rf03_09 .section-title-categoryitems,
.rf03_10 .section-title-categoryitems,
.ct27 .section-title-categoryitems,
.ct51 .section-title-categoryitems,
.ct52 .section-title-categoryitems,
.ct66 .section-title-categoryitems,
.ct67 .section-title-categoryitems {
/* margin: 120px 0 80px; */
height: 90vh;
background-position-x: center;
font-size: 1.7em;
color: #fff;
text-shadow: 0 0 10px #000;
}
.rf03_00 .section-title-categoryitems .section-title--inner,
.rf03_01 .section-title-categoryitems .section-title--inner,
.rf03_02 .section-title-categoryitems .section-title--inner,
.rf03_03 .section-title-categoryitems .section-title--inner,
.rf03_04 .section-title-categoryitems .section-title--inner,
.rf03_05 .section-title-categoryitems .section-title--inner,
.rf03_06 .section-title-categoryitems .section-title--inner,
.rf03_07 .section-title-categoryitems .section-title--inner,
.rf03_08 .section-title-categoryitems .section-title--inner,
.rf03_09 .section-title-categoryitems .section-title--inner,
.rf03_10 .section-title-categoryitems .section-title--inner,
.ct27 .section-title-categoryitems .section-title--inner,
.ct51 .section-title-categoryitems .section-title--inner,
.ct52 .section-title-categoryitems .section-title--inner,
.ct66 .section-title-categoryitems .section-title--inner,
.ct67 .section-title-categoryitems .section-title--inner {
top: 60%;
font-size: 1.7em;
}
@media screen and (max-width: 768px){
.--sp-only{
display: initial!important;
}
.--pc-only{
display: none!important;
}
.--pcw70,
.--pcw48,
.--pcw35 {
width: 100%;
}
.Headline__title.--jumbo {
font-size: 2.2rem;
}
.Headline__title.--huge {
font-size: 1.4rem;
}
.Headline__title.--large {
font-size: 1.2rem;
}
.Headline__title.--medium {
font-size: 1.1rem;
font-weight: 700;
}
.Headline__lead.--jumbo {
font-size: 1.2rem;
}
.Headline__lead.--huge {
font-size: 1rem;
}
.Headline__lead.--large {
font-size: 1rem;
font-weight: 400;
}
.Headline__lead.--medium {
font-size: 0.9rem;
font-weight: 400;
}
.Headline__lead.--small {
font-size: 0.8rem;
font-weight: 400;
}
.section-title{
margin: 50px 0;
font-size: 28px;
letter-spacing: -1px;
}
.section-title:after{
top: 60px;
}
.section-title-categoryitems{
margin: 0;
}
.section-title--inner{
width: 90%;
}
.rf03_00 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/all_items_sp.jpg);
}
.rf03_01 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20230401/andcolor_sp.jpg);
}
.rf03_02 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20230401/botanical-garden_sp.jpg);
}
.rf03_03 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20230401/ath-medical_sp.jpg);
}
.rf03_04 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20250301/couturelook_sp.jpg);
}
.rf03_05 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/noble-navy_sp.jpg);
}
.rf03_06 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20230401/stylish-scrub_sp.jpg);
}
.rf03_07 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20250301/doctorcoat_sp.jpg);
}
.rf03_08 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20230401/basic-lineup_sp.jpg);
}
.rf03_09 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20230401/medical-pants_sp.jpg;
}
.rf03_10 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20230401/work-style-reform_sp.jpg);
}
.ct27 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/hogara-shorts_sp.jpg);
}
.ct51 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20250301/champion_sp.jpg);
}
.ct52 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20250301/colorfastscrub_sp.jpg);
}
.ct66 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20250301/@Museum_sp.jpg);
}
.ct67 .section-title-categoryitems{
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/series/NEW_20250301/wellbescrub_sp.jpg);
}
/* ------------------------------------------------------------
About繝壹�繧ｸ
------------------------------------------------------------ */
/* MV */
.section-title-about {
margin: 0 0 3em;
padding: 0;
line-height: 1;
height: 90vh;
background-size: cover;
background-position-x: center;
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/about/NEW_20250301/aboutvol10_mv_pc.jpg);
}
.section-title-about .section-title--inner {
top: 50%;
left: 0;
text-align: left;
}
/* 繝ｪ繝ｳ繧ｯ */
.Section__more {
text-align: right;
}
.Section__more.--link{
position: relative;
padding-right: 1.5em;
text-decoration: none;
}
.Section__more.--link:hover{
text-decoration: underline;
}
.Section__more.--link:after{
content: ' ';
position: absolute;
top: 0.2em;
right: 0.5em;
display: block;
width: 14px;
height: 14px;
border: 0px;
border-top: solid 1px #CC4C80;
border-right: solid 1px #CC4C80;
transform: rotate(45deg);
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
/* Stress Free */
.Headline__title--stress-free {
position: absolute;
top: 35%;
right: 0;
}
.Section__stress-free--intro {
color: #CC4C80;
font-weight: 500;
margin-bottom: 0.3em;
}
/* Pattern Design */
.Headline__content--pattern-design {
display: flex;
flex-wrap: wrap;
flex-direction: column;
justify-content: space-between;
align-content: space-between;
height: 1200px;
margin: 3em 0 3em;
}
.Headline__item--pattern-design {
width: 45%;
}
.Headline__img--pattern-design {
width: 100%;
}
@media screen and (max-width: 768px){
.section-title-about {
background-image: url(https://gigaplus.makeshop.jp/raffiria/img/about/NEW_20250301/aboutvol10_mv_sp.jpg);
}
.section-title-about .section-title--inner {
top: 3%;
left: 0;
padding: 0;
text-align: left;
}
.Headline__title--stress-free {
position: relative;
top: 0;
left: 0;
}
.Headline__content--pattern-design {
height: auto;
}
.Headline__item--pattern-design {
width: 100%;
margin-bottom: 1em;
}
.silhouette-text {
padding-left: 10px;
}
}
/* ------------------------------------------------------------
top繝壹�繧ｸ霑ｽ蜉�繧ｨ繝ｪ繧｢
------------------------------------------------------------ */
.main-contents.main-contents-top-benefits {
width: 100%;
max-width: inherit;
background: #F5F5F5;
padding: 0;
margin: 80px 0;
}
.top-benefits-wrap {
width: 100%;
max-width: 1050px;
margin: 0 auto;
display: flex;
padding: 30px 0;
}
.top-benefits-wrap dl {
width: 25%;
padding: 0 20px;
display: flex;
flex-direction: column;
}
.top-benefits-wrap dl:not(:last-child) {
border-right: 1px solid #D3D3D3;
}
.top-benefits-wrap dt {
width: 100%;
font-size: 1em;
font-weight: 500;
text-align: center;
padding-top: 70px;
margin-bottom: 1em;
position: relative;
}
.top-benefits-wrap dd {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
}
.top-benefits-wrap .btmBox {
display: block;
width: 100%;
margin-top: auto;
}
.top-benefits-wrap dd .member-commonBtn {
font-size: 0.8em;
padding: 14px 20px;
}
.top-benefits-wrap dl:first-child dt::after {
display: block;
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
margin: auto;
width: 100px;
height: 70px;
background: url("https://gigaplus.makeshop.jp/raffiria/img/membership/2022-12/icon_top_point.svg") center center no-repeat;
background-size: auto 38px;
}
.top-benefits-wrap dl:nth-child(2) dt::after {
display: block;
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
margin: auto;
width: 100px;
height: 70px;
background: url("https://gigaplus.makeshop.jp/raffiria/img/membership/icon/icon_pencil.svg") center center no-repeat;
background-size: auto 38px;
}
.top-benefits-wrap dl:nth-child(3) dt::after {
display: block;
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
margin: auto;
width: 100px;
height: 70px;
background: url("https://gigaplus.makeshop.jp/raffiria/img/membership/icon/icon_noter.svg") center center no-repeat;
background-size: auto 30px;
}
.top-benefits-wrap dl:nth-child(4) dt::after {
display: block;
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
margin: auto;
width: 100px;
height: 70px;
/* background: url("https://gigaplus.makeshop.jp/raffiria/img/membership/icon/icon_mail.svg") center center no-repeat;
background-size: auto 28px; */
background: url("https://gigaplus.makeshop.jp/raffiria/img/icon/bookmark.svg") center center no-repeat;
background-size: auto 38px;
}
@media screen and (max-width: 768px){
.main-contents.main-contents-top-benefits {
margin: 50px 0;
}
.top-benefits-wrap {
width: 90%;
max-width: inherit;
margin: 0 auto;
display: block;
padding: 0;
}
.top-benefits-wrap dl {
width: 100%;
padding: 30px 0 50px;
display: block;
}
.top-benefits-wrap dl:not(:last-child) {
border-bottom: 1px solid #D3D3D3;
border-right: 0;
}
.top-benefits-wrap .btmBox {
display: block;
width: 90%;
margin: 0 auto;
}
.top-benefits-wrap dd .member-commonBtn {
font-size: 1em;
}
}
/* ------------------------------------------------------------
譁ｰ隕丈ｼ壼藤逋ｻ骭ｲ繝壹�繧ｸ
------------------------------------------------------------ */
.main-contents-membership * {
box-sizing: border-box;
}
.membership-wrap {
margin-bottom: 80px;
}
.main-contents-membership .fc-red {
color: #D65745;
}
.membership-wrap .note {
font-size: .7em;
margin-left: 1em;
text-indent: -1em;
}
.membership-wrap h3 {
font-size: 1.4em;
line-height: 1;
background: #DADADA;
padding: 20px;
margin-bottom: 2em;
}
.member-commonBtn {
display: block;
text-align: center;
font-weight: 500;
background: #BD557F;
color: #fff;
padding: 20px;
margin-top: 2em;
transition: all .3s ease;
cursor: pointer;
border-radius: 10px;
}
.member-commonBtn:hover {
text-decoration: none;
opacity: .7;
}
/* 縺ｱ繧薙￥縺� */
.breadcrumb.__membership {
margin: 10px 0 40px;
}
/* 繧ｭ繝｣繝�メ繧ｳ繝斐�縺ｨ繝ｪ繝ｼ繝画枚 */
.section-title-membership {
font-size: 2.2em;
font-weight: 500;
margin: 50px 0 40px;
}
.Headline__lead-membership {
font-family: 'Noto Serif JP', serif;
font-size: 1.3rem;
font-weight: 300;
line-height: 1.6;
margin-bottom: 3em;
}
/* MEMBERSHIP */
.membership {
background: #f5f5f5;
padding: 50px 24px;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.membership > dt {
width: 100%;
font-size: 1.6rem;
text-align: center;
margin-bottom: 1.4em;
font-weight: 500;
}
.membership > dd {
background: #fff;
width: 32%;
padding: 30px 20px 20px;
}
.benefits {
display: block;
text-align: center;
padding-bottom: 80px;
position: relative;
}
.benefits dt {
font-family: 'Noto Serif JP', serif;
font-size: 1.8em;
font-weight: 500;
line-height: 1;
margin-bottom: 16px;
}
.benefits dt span {
display: block;
font-size: .5em;
margin-bottom: 6px;
}
.benefits dd {
font-weight: 500;
}
.membership > dd:nth-of-type(1) .benefits::after {
display: block;
content: "";
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: auto;
width: 100px;
height: 60px;
background: url("https://gigaplus.makeshop.jp/raffiria/img/membership/icon/icon_present-lc.svg") center center no-repeat;
background-size: auto 100%;
}
.membership > dd:nth-of-type(2) .benefits::after {
display: block;
content: "";
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: auto;
width: 100px;
height: 40px;
background: url("https://gigaplus.makeshop.jp/raffiria/img/membership/icon/icon_mail-lc.svg") center center no-repeat;
background-size: auto 100%;
}
.membership > dd:nth-of-type(3) .benefits::after {
display: block;
content: "";
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: auto;
width: 100px;
height: 50px;
background: url("https://gigaplus.makeshop.jp/raffiria/img/membership/icon/icon_user-lc.svg") center center no-repeat;
background-size: auto 100%;
}
/* 莨壼藤讒倥∈縺ｮ迚ｹ蜈ｸ */
.memberBenefit dl dt {
font-size: 1.2em;
font-weight: 500;
padding: 0 10px 10px;
margin-bottom: 1em;
border-bottom: 1px solid #C1C1C1;
}
.memberBenefit dl dt .bene-num {
font-family: 'Noto Serif JP', serif;
font-size: 1.1em;
padding-right: 1em;
}
.memberBenefit dl dd {
padding: 0 50px;
margin-bottom: 60px;
}
.memberBenefit dl dd p {
margin-bottom: 1em;
}
.memberBenefit .member-commonBtn {
width: 400px;
margin: 0 auto;
}
/* 豕穂ｺｺ讒倥�莨壼藤逋ｻ骭ｲ繝ｻ縺翫∪縺ｨ繧∬ｲｷ縺�ｳｨ譁�↓髢｢縺励※ */
.mAboutWrap {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.mAboutWrap li {
width: 49%;
}
.mAboutWrap li img {
width: 100%;
vertical-align: bottom;
}
.mAboutWrap dt {
font-size: 1.5em;
font-weight: 500;
text-align: center;
margin-bottom: 1em;
padding-top: 70px;
}
.mAboutWrap dd p {
margin-bottom: 1em;
}
.mAboutWrap.__upper {
margin-bottom: 20px;
}
.mAboutWrap.__upper dl {
display: inline-block;
background: #f5f5f5;
padding: 10% 8%;
}
.mAboutWrap.__upper dl:first-child {
margin-bottom: 20px;
}
.upperbox {
display: flex;
flex-direction: column;
justify-content: flex-start;
}
.mAboutWrap.__upper dl:first-child dt {
background: url("https://gigaplus.makeshop.jp/raffiria/img/membership/icon/icon_pencil.svg") center top no-repeat;
background-size: auto 48px;
}
.mAboutWrap.__upper dl:last-child dt {
background: url("https://gigaplus.makeshop.jp/raffiria/img/membership/icon/icon_office.svg") center top no-repeat;
background-size: auto 50px;
}
.mAboutWrap.__lower li {
background: #f5f5f5;
padding: 4%;
margin-bottom: 20px;
}
.mAboutWrap.__lower li:nth-last-child(-n+2) {
margin-bottom: 0;
}
.mAboutWrap.__lower li:first-child dt {
background: url("https://gigaplus.makeshop.jp/raffiria/img/membership/icon/icon_tshirt.svg") center top no-repeat;
background-size: auto 48px;
}
.mAboutWrap.__lower li:nth-child(2) dt {
background: url("https://gigaplus.makeshop.jp/raffiria/img/membership/icon/icon_embroidery.svg") center top no-repeat;
background-size: auto 48px;
}
.mAboutWrap.__lower li:nth-child(3) dt {
background: url("https://gigaplus.makeshop.jp/raffiria/img/membership/icon/icon_box.svg") center top no-repeat;
background-size: auto 56px;
}
.mAboutWrap.__lower li:nth-child(4) dt {
background: url("https://gigaplus.makeshop.jp/raffiria/img/membership/icon/icon_noter.svg") center top no-repeat;
background-size: auto 42px;
}
@media screen and (max-width: 768px){
.main-contents-membership {
width: 100%;
}
.membership-wrap {
width: 90%;
margin: 0 auto 50px;
}
.membership-wrap.__fullwidth {
width: 100%;
}
.membership-wrap h3 {
font-size: 1.2em;
padding: 14px;
margin-bottom: 1em;
}
/* 縺ｱ繧薙￥縺� */
.breadcrumb.__membership {
width: 90%;
margin: 10px auto 30px;
}
/* 繧ｭ繝｣繝�メ繧ｳ繝斐�縺ｨ繝ｪ繝ｼ繝画枚 */
.section-title-membership {
font-size: 1.8em;
width: 90%;
margin: 50px auto 40px;
}
.Headline__lead-membership {
font-size: 1.2em;
width: 90%;
margin: 0 auto 2em;
}
/* MEMBERSHIP */
.membership {
padding: 50px 5%;
display: block;
}
.membership > dt {
width: 100%;
font-size: 1.5rem;
}
.membership > dd {
background: #fff;
width: 100%;
}
.membership > dd:not(:last-child) {
margin-bottom: 20px;
}
.benefits {
text-align: left;
padding-bottom: 0;
}
.benefits dt {
font-size: 2em;
margin-bottom: 1em;
display: flex;
align-items: center;
}
.benefits dt span {
display: inline;
font-size: .5em;
margin: 0;
padding: 4px 1em 0 0;
}
.membership > dd:nth-of-type(1) .benefits::after {
bottom: inherit;
top: 0;
left: inherit;
right: 0;
margin: auto;
height: 50px;
background: url("https://gigaplus.makeshop.jp/raffiria/img/membership/icon/icon_present-lc.svg") right center no-repeat;
background-size: auto 100%;
background-color:rgba(255,255,255,0.6);
background-blend-mode:lighten;
}
.membership > dd:nth-of-type(2) .benefits::after {
bottom: inherit;
top: 0;
left: inherit;
right: 0;
margin: auto;
height: 30px;
background: url("https://gigaplus.makeshop.jp/raffiria/img/membership/icon/icon_mail-lc.svg") right center no-repeat;
background-size: auto 100%;
background-color:rgba(255,255,255,0.6);
background-blend-mode:lighten;
}
.membership > dd:nth-of-type(3) .benefits::after {
bottom: inherit;
top: 0;
left: inherit;
right: 0;
margin: auto;
width: 100px;
height: 40px;
background: url("https://gigaplus.makeshop.jp/raffiria/img/membership/icon/icon_user-lc.svg") right center no-repeat;
background-size: auto 100%;
background-color:rgba(255,255,255,0.6);
background-blend-mode:lighten;
}
/* 莨壼藤讒倥∈縺ｮ迚ｹ蜈ｸ */
.memberBenefit dl dt {
font-size: 1.1em;
padding: 0 0 10px;
display: flex;
}
.memberBenefit dl dt .bene-num {
font-family: 'Noto Serif JP', serif;
font-size: 1.1em;
padding-right: 1em;
margin-top: -3px;
}
.memberBenefit dl dd {
padding: 0 ;
margin-bottom: 40px;
}
.memberBenefit dl dd p {
margin-bottom: 1em;
}
.memberBenefit .member-commonBtn {
width: 100%;
}
/* 豕穂ｺｺ讒倥�莨壼藤逋ｻ骭ｲ繝ｻ縺翫∪縺ｨ繧∬ｲｷ縺�ｳｨ譁�↓髢｢縺励※ */
.mAboutWrap {
display: block;
}
.mAboutWrap li {
width: 100%;
}
.mAboutWrap li img {
margin-bottom: 20px;
}
.mAboutWrap dt {
font-size: 1.3em;
margin-bottom: 1em;
}
.mAboutWrap.__upper {
margin-bottom: 0;
}
.mAboutWrap.__upper dl {
width: 100%;
padding: 10% 8%;
}
.mAboutWrap.__upper dl:first-child {
margin-bottom: 20px;
}
.upperbox {
display: block;
}
.mAboutWrap.__upper dl:first-child dt {
background-size: auto 44px;
}
.mAboutWrap.__lower li {
background: #f5f5f5;
padding: 40px 5% 20px;
margin-bottom: 0;
position: relative;
}
.mAboutWrap.__lower li::before{
display: block;
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
margin: auto;
width: 90%;
height: 1px;
background: #D3D3D3;
}
.mAboutWrap.__lower li:first-child dt {
background-size: auto 40px;
}
.mAboutWrap.__lower li:nth-child(2) dt {
background-size: auto 40px;
}
.mAboutWrap.__lower li:nth-child(3) dt {
background-size: auto 48px;
}
.mAboutWrap.__lower li:nth-child(4) dt {
background-size: auto 36px;
}
.combtn-box {
background: #f5f5f5;
padding: 30px 5%;
position: relative;
}
.combtn-box::before{
display: block;
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
margin: auto;
width: 90%;
height: 1px;
background: #D3D3D3;
}
.combtn-box a {
margin-top: 0;
}
}