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

  button {
border: none;
cursor: pointer;
outline: none;
padding: 0;
appearance: none;
}
input[type="submit"],
input[type="button"] {
border-radius: 0;
-webkit-box-sizing: content-box;
-webkit-appearance: button;
appearance: button;
border: none;
box-sizing: border-box;
cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
outline-offset: -2px;
}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font: inherit;
font-size: 100%;
vertical-align: baseline;
}
html {
line-height: 1;
}
ol, ul {
list-style: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
caption, th, td {
text-align: left;
font-weight: normal;
vertical-align: middle;
}
q, blockquote {
quotes: none;
}
q:before, q:after, blockquote:before, blockquote:after {
content: "";
content: none;
}
a img {
border: none;
}
.Section__block img { max-width:400px; height:auto; }
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
display: block;
}
@media screen and (min-width: 668px) {
.alpha {
-webkit-transition: 0.1s;
-moz-transition: 0.1s;
transition: 0.1s;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.alpha:hover {
opacity: 0.6;
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
opacity: 0.5;
zoom: 1;
}
.sp {
display: none !important;
}
}
input[type="submit"],
input[type="button"] {
border-radius: 0;
-webkit-box-sizing: content-box;
-webkit-appearance: button;
appearance: button;
border: none;
box-sizing: border-box;
cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
outline-offset: -2px;
}
html {
font-family: 'YuGothic',"游ゴシック",'Hiragino Kaku Gothic ProN',"ヒラギノ角ゴ ProN W3",'Meiryo',"メイリオ",'MS PGothic',"ＭＳ Ｐゴシック",sans-serif;
font-size: 10px;
width: 100%;
margin: 0;
color: #2F2F2F;
border-top: 4px solid #BCB9AD;
}
* {
box-sizing: border-box;
}
img {
vertical-align: bottom;
}
a {
color: #2F2F2F;
text-decoration: none;
}
body {
font-size: 1.4rem;
line-height: 1.3;
position: relative;
} .Header, .Content, .Footer__inner {
width: 1000px;
margin: auto;
}
.Header {
-js-display: flex;
display: flex;
justify-content: space-between;
margin: auto;
margin-top: 30px;
}
.Header .Header__left > p:not([class]) { font-size:1.2rem; margin-bottom:1em; line-height:3em; }
.Header .Header__left > p:not([class]) img { width:auto; height:3em; margin:0 1em 0 .6em; }
.Header__nav {
width: 365px;
}
.Header__nav ul {
-js-display: flex;
display: flex;
justify-content: space-between;
align-items: flex-end;
}
.Header__nav a {
color: #5F5F5F;
}
.Header__nav .Header__nav__list {
text-align: center;
font-weight: bold;
width: 60px;
}
.Header__nav .Header__nav__list a {
display: block;
padding-top: 46px;
background-repeat: no-repeat;
background-position: center top;
background-size: 40px;
}
.Header__nav--event {
background-image: url(//aromicstyle.com/blog/wp-content/themes/aromicstyle/img/icon-event.svg);
background-position: center top 2px;
}
.Header__nav--health {
background-image: url(//aromicstyle.com/blog/wp-content/themes/aromicstyle/img/icon-health.svg);
}
.Header__nav--aroma {
background-image: url(//aromicstyle.com/blog/wp-content/themes/aromicstyle/img/icon-aroma.svg);
}
.Header__nav--life {
background-image: url(//aromicstyle.com/blog/wp-content/themes/aromicstyle/img/icon-life.svg);
background-position: center top 3px;
padding: 46px 6px 0px 6px;
}
.Header__nav--company {
background-image: url(//aromicstyle.com/blog/wp-content/themes/aromicstyle/img/icon-company.svg);
background-position: center top 4px;
}
.Header__right {  }
.Header__right .link-box { display:flex; justify-content:space-between; width:19em; margin-bottom:-1.6em; text-align:center; }
.Header__right .link-box a { display:block; width:calc(100%/2 - .4em); padding:.4em; color:#32693e; background:#edf5ee; border:1px solid; border-left:none; border-right:none; }
.Header__right .link-box a:hover { border-color:#edf5ee; }
.Sns_btn {
height: 20px;
text-align: right;
}
.Sns_btn .fb_iframe_widget > span {
vertical-align: baseline !important;
}
.searchform {
display: inline-block;
vertical-align: bottom;
height: 32px;
border: 1px solid #BCB9AD;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
margin-left: 8px;
position: relative;
}
.searchform .searchinput {
border: none;
height: 30px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
font-size: 1.4rem;
padding: 0 30px 0 8px;
}
.searchform .searchsubmit {
width: 30px;
height: 30px;
border: none;
background: url(//aromicstyle.com/blog/wp-content/themes/aromicstyle/img/icon_search.svg) center no-repeat;
position: absolute;
right: 0;
top: 0px;
background-size: 16px auto;
}
.Header__about {
display: inline-block;
vertical-align: bottom;
margin-top: 12px;
font-size: 1.2rem;
}
.Header__about a {
display: inline-block;
float: right;
height: 32px;
line-height: 32px;
padding: 0 8px 0 18px;
background: #F4F4F4;
position: relative;
margin-right: auto;
}
.Header__about a:before {
content: '';
width: 6px;
height: 6px;
border: 0px;
border-top: solid 1px #BCB9AD;
border-right: solid 1px #BCB9AD;
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
position: absolute;
top: 50%;
left: 6px;
margin-top: -4px;
} .Content {
overflow: hidden;
*zoom: 1;
margin: 30px auto 60px;
}
.Content__left {
width: 664px;
float: left;
position: relative;
}
.Content__right {
width: 304px;
float: right;
}
.Content__right .Section__ttl {
height: 40px;
line-height: 40px;
background: #F4F4F4;
border-left: 1px solid #BCB9AD;
padding-left: 16px;
}
.Content__right .Section__ttl--faq a {
background: #F4F4F4 url(//aromicstyle.com/blog/wp-content/themes/aromicstyle/img/icon-arrow.svg) right 8px center no-repeat;
background-size: 18px;
}
.Breadcrumb {
font-size: 1.2rem;
}
.Breadcrumb a {
text-decoration: underline;
}
.Section__ttl {
font-size: 1.2rem;
font-weight: bold;
-js-display: flex;
display: flex;
align-items: center;
}
.Section__ttl span {
padding-left: 8px;
}
.Section__ttl a {
-js-display: flex;
display: flex;
align-items: center;
width: 100%;
}
.bx-next, .bx-prev {
opacity: 0;
display: block;
height: 26px;
width: 26px;
top: -3px;
left: -3px;
position: absolute;
}
.btn-prev, .btn-next {
display: inline-block;
position: absolute;
height: 26px;
width: 13px;
top: 270px;
}
.btn-prev:before, .btn-next:before {
content: '';
width: 16px;
height: 16px;
border: 0px;
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
position: absolute;
top: 0;
left: 0;
}
.btn-prev {
left: 4px;
}
.btn-prev:before {
border-bottom: solid 2px #5F5F5F;
border-left: solid 2px #5F5F5F;
left: 0;
}
.btn-next {
right: 4px;
}
.btn-next:before {
border-top: solid 2px #5F5F5F;
border-right: solid 2px #5F5F5F;
right: 0;
} .Entry__ttl {
font-weight: bold;
}
.Entry__cat, .Entry__date {
display: inline-block;
vertical-align: middle;
}
.Entry__cat {
display: inline-block;
padding: 1px 4px;
background-repeat: no-repeat;
background-position: left center;
padding-left: 1.8em;
background-size: auto 100%;
}
.Entry__cat.Entry__cat--event {
background-image: url(//aromicstyle.com/blog/wp-content/themes/aromicstyle/img/icon-event.svg);
color: #CCAB84;
}
.Entry__cat.Entry__cat--health {
background-image: url(//aromicstyle.com/blog/wp-content/themes/aromicstyle/img/icon-health.svg);
color: #D19595;
}
.Entry__cat.Entry__cat--aroma {
background-image: url(//aromicstyle.com/blog/wp-content/themes/aromicstyle/img/icon-aroma.svg);
color: #9A92AC;
}
.Entry__cat.Entry__cat--life {
background-image: url(//aromicstyle.com/blog/wp-content/themes/aromicstyle/img/icon-life.svg);
color: #8AA79C;
}
.Entry__cat.Entry__cat--company {
background-image: url(//aromicstyle.com/blog/wp-content/themes/aromicstyle/img/icon-company.svg);
color: #8B9FB9;
}
.Entry__date {
color: #848280;
padding-left: 8px;
}
.Entry__text {
margin-top: 16px;
line-height: 1.7;
} .Top_entry, .Recommend_entry, .Content__goods {
width: 616px;
margin: auto;
height: 600px;
overflow: hidden;
}
.Top_entry li, .Recommend_entry li, .Content__goods li {
height: 600px;
}
.Top_entry li a, .Recommend_entry li a, .Content__goods li a {
display: block;
}
.Top_entry .bx-wrapper, .Recommend_entry .bx-wrapper, .Content__goods .bx-wrapper {
margin: auto;
}
.Top_entry .Entry__img img, .Recommend_entry .Entry__img img, .Content__goods .Entry__img img {
width: 100%;
height: 393px;
object-fit: cover;
}
.Top_entry .Entry__cont, .Recommend_entry .Entry__cont, .Content__goods .Entry__cont {
display: block;
background: #F4F4F4;
padding: 24px;
}
.Top_entry .Entry__ttl, .Recommend_entry .Entry__ttl, .Content__goods .Entry__ttl {
font-size: 2.4rem;
}
.Top_entry .Entry__cat, .Recommend_entry .Entry__cat, .Content__goods .Entry__cat, .Top_entry .Entry__date, .Recommend_entry .Entry__date, .Content__goods .Entry__date {
margin-top: 16px;
}
.Top_entry .Entry__text, .Recommend_entry .Entry__text, .Content__goods .Entry__text {
margin-top: 16px;
}
.Top_entry li:not(:first-child){
display: none;
}
.Top_entry .bx-viewport li:not(:first-child) {
display: block !important;
} .Recommend_entry {
margin-top: 24px;
height: auto;
width: auto;
overflow: auto;
}
.Recommend_entry .Recommend_entry__list {
-js-display: flex;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-top: 8px;
}
.Recommend_entry li {
height: auto;
width: 148px;
margin-top: 8px;
}
.Recommend_entry .Entry__img img {
height: 94px;
}
.Recommend_entry .Entry__cont {
padding: 14px 10px;
}
.Recommend_entry .Entry__ttl {
font-size: 1.2rem;
}
.Recommend_entry .Entry__cat, .Recommend_entry .Entry__date {
margin-top: 8px;
}
.Recommend_entry .Entry__cat {
font-size: 1.1rem;
padding-left: 1.5em;
line-height: 1;
display: block;
padding-right: 6px;
}
.Recommend_entry .Entry__date {
font-size: 1.2rem;
padding-left: 0;
} .New_entry, .Rank_entry {
margin-top: 20px;
}
.New_entry li, .Rank_entry li {
margin-top: 16px;
}
.New_entry li > a, .Rank_entry li > a {
display: block;
-js-display: flex;
display: flex;
justify-content: space-between;
}
.New_entry .Entry__img, .Rank_entry .Entry__img {
width: 200px;
height: 128px;
}
.New_entry .Entry__img img, .Rank_entry .Entry__img img {
width: 100%;
height: 128px;
object-fit: cover;
}
.New_entry .Entry__cont, .Rank_entry .Entry__cont {
width: 460px;
padding-left: 16px;
}
.New_entry .Entry__ttl, .Rank_entry .Entry__ttl {
font-size: 2rem;
}
.New_entry .Entry__cat, .Rank_entry .Entry__cat, .New_entry .Entry__date, .Rank_entry .Entry__date {
margin-top: 16px;
}
.New_entry .Entry__text, .Rank_entry .Entry__text {
margin-top: 24px;
} .Rank_entry {
margin-top: 0;
}
.Rank_entry .Entry__img {
width: 112px;
height: 72px;
position: relative;
}
.Rank_entry .Entry__img img {
width: 100%;
height: 72px;
object-fit: cover;
}
.Rank_entry .Entry__img .Entry__num {
height: 20px;
width: 20px;
color: #fff;
text-align: center;
line-height: 20px;
background: #9A9791;
position: absolute;
top: 0;
right: 0;
}
.Rank_entry .Entry__cont {
width: 192px;
padding-left: 12px;
}
.Rank_entry .Entry__ttl {
font-size: 1.4rem;
line-height: 1.4;
}
.Rank_entry .Entry__cat, .Rank_entry .Entry__date {
margin-top: 8px;
font-size: 1.2rem;
}
.Rank_entry .Entry__cat {
padding-right: 8px;
}
.Rank_entry .Entry__date {
padding-left: 0;
}
#more-button {
display: block;
width: 111px;
margin: 40px auto;
} .Cat_list {
margin-top: 24px;
}
.Cat_list ul {
-js-display: flex;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-top: 8px;
}
.Cat_list li {
width: 48%;
margin-top: 8px;
}
.Cat_list li a {
display: block;
text-align: center;
background: #F4F4F4;
padding: .5em .2em;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
} .bnr_list { display:block; margin-top:1.2em; }
.bnr_list a { display:block; width:100%; }
.bnr_list a:nth-of-type(n+2) { margin-top:1em; }
.bnr_list a img { display:block; width:100%; height:auto; }
.side_other {
margin-top: 24px;
}
.company_about {
margin-top: 24px;
margin-bottom: 48px;
background: #EBE8E2;
table-layout: fixed;
width: 100%;
text-align: center;
position: relative;
}
.company_about > div {
display: table;
}
.company_about > div > div {
display: table-cell;
}
.company_about > div > div:first-child {
padding: 24px 24px 32px;
}
.company_about .company_about__bg {
width: 192px;
height: 100%;
background: url(//aromicstyle.com/blog/wp-content/themes/aromicstyle/img/about_bg.jpg) center no-repeat;
background-size: cover;
}
.company_about .company_about__catch {
font-size: 2rem;
margin-top: .5em;
}
.company_about .company_about__txt {
margin-top: .8em;
font-size: 1.6rem;
line-height: 2;
}
.company_about .company_about__list {
background: #fff;
margin-top: 1em;
padding: 16px 24px;
}
.company_about .company_about__list li {
text-align: left;
font-size: 1.6rem;
padding-left: 1.5em;
line-height: 2;
background: url(//aromicstyle.com/blog/wp-content/themes/aromicstyle/img/icon-check.svg) left center no-repeat;
background-size: 16px;
}
.company_about > a {
display: block;
color: #fff;
font-size: 1.8rem;
padding: .2em 1.5em .2em .8em;
background: #70BDC6;
border-radius: 20px;
position: absolute;
bottom: 8px;
right: 8px;
}
.company_about > a:after {
position: absolute;
top: 50%;
right: 10px;
content: '';
display: block;
width: 6px;
height: 6px;
border-top: 1px solid;
border-right: 1px solid;
transform: translate(-25%, -50%) rotate(45deg);
} .Content__entry {
font-size: 1.6rem;
margin-top: 24px;
}
.Entry__ttl {
font-size: 2.8rem;
}
.Entry__head {
-js-display: flex;
display: flex;
justify-content: space-between;
margin-top: 24px;
}
.Entry__cat, .Entry__date {
font-size: 1.4rem;
}
.Entry__cat {
line-height: 1;
}
.Entry__mv {
margin-top: 24px;
}
.Entry__mv img {
width: 100%;
height: auto;
}
.Entry__contents {
margin-top: 48px;
padding: 32px;
background: #F4F4F4;
}
.Entry__contents li {
margin-top: 24px;
text-indent: -1em;
margin-left: 1em;
}
.Entry__contents li a {
text-decoration: underline;
}
.Entry__contents li a strong { font-weight:600; color:#0085cd; }
.Section__catch {
margin-top: 48px;
padding: 0 16px;
line-height: 2;
}
.Content__section {
margin-top: 48px;
}
.Content__section .Section__ttl {
font-size: 2.4rem;
font-weight: bold;
line-height: 1.7;
border-left: 1px solid #BCB9AD;
padding-left: 16px;
}
.Content__section .Section__text {
margin-top: 24px;
padding: 0 16px;
line-height: 2;
}
.Content__section .Section__img {
margin: 24px auto 0;
padding: 0 16px;
width: 75%;
}
.Content__section .Section__img img {
width: 100%;
height: auto;
}
.Content__section a {
color: #0085cd;
word-break: break-all;
} .Content__section dl.article-link { padding:1% 1% 0; font-size:95%!important; border:1px solid #aaa; box-sizing:border-box; }
.Content__section dl.article-link dt { padding:0 .5em .3em; border-bottom:1px solid #aaa; }
.Content__section dl.article-link dd a { display:block; padding:.5em; font-weight:700; }
.Content__section dl.article-link:not(.img) dd a:before { position:relative; top:-2px; content:"\25BC"; display:inline-block; margin-right:2px; font-size:90%; transform:rotate(-90deg); }
.Content__section dl.article-link dd a:hover { background:#ecf8ff; }
.Content__section dl.article-link dd a { display:block; padding:.5em; font-weight:700; } .Content__section dl.article-link.img dd a img { display:block; width:100%; }
@media screen and (min-width:668px) {
.Content__section dl.article-link.img dd { display:flex; flex-wrap:wrap; align-items:stretch; }
.Content__section dl.article-link.img dd a { width:calc(100%/3); }
.Content__section dl.article-link.img dd a:nth-of-type(-n+3) { margin-top:.2em; }
.Content__section dl.article-link.img dd a p { margin-top:.4em; }
}
@media screen and (max-width:667px) {
.Content__section dl.article-link.img dd a { display:flex; align-items:center; }
.Content__section dl.article-link.img dd a:first-of-type { margin-top:.4em; }
.Content__section dl.article-link.img dd a:last-of-type { margin-bottom:.4em; }
.Content__section dl.article-link.img dd a img { width:40%; }
.Content__section dl.article-link.img dd a p { margin-left:.4em; }
}
@media screen and (max-width:375px) {
.Content__section dl.article-link.img { font-size:90%!important; }
} #logly-lift-4300380 { width:calc(100% - 32px); margin:3em auto!important; }
@media screen and (max-width:667px) {
#logly-lift-4300380 { width:100%; margin:auto!important; }
#logly-lift-4300379 { margin:2.8em auto; }
} .Content__section [class^='aroma-'] + [class^='aroma-'] { margin-top:2em; }
@media screen and (max-width:600px) {
.Content__section [class^='aroma-'] { font-size:.9em; }
}
.Content__section dl.aroma-spec {
display:flex;
flex-wrap:wrap;
justify-content:flex-start;
align-items:stretch;
width:100%;
margin:auto;
background:#f7f7f7;
border:1px dashed #999;
}
.Content__section dl.aroma-spec > * { padding:.6em; line-height:1.4em; border-top:1px dashed; border-color:#999!important; }
.Content__section dl.aroma-spec > *:nth-of-type(-n+1) { border-top:none; }
.Content__section dl.aroma-spec dt { width:6em; border-right:1px dashed; }
.Content__section dl.aroma-spec dd { width:calc(100% - 6em); }
.Content__section section.aroma-use {
display:flex;
flex-wrap:wrap;
justify-content:flex-start;
align-items:center;
}
.Content__section section.aroma-use > img { width:7.5em; height:auto; margin:0 .4em .4em 0; border-radius:50%; }
.Content__section section.aroma-use > img:last-of-type { margin-right:0; }
.Content__section section.aroma-use ul {
display:flex;
flex-wrap:wrap;
justify-content:flex-start;
align-items:stretch;
width:100%;
font-size:.9em;
}
.Content__section section.aroma-use li {
display:flex;
flex-wrap:wrap;
align-content:center;
align-items:center;
background:#f7f7f7;
width:8.4em;
height:8.4em;
margin:0 .4em .4em 0;
border-radius:50%;
}
.Content__section section.aroma-use li:last-of-type { margin-right:0; }
.Content__section section.aroma-use li > * { display:block; }
.Content__section section.aroma-use li img { width:calc(100% - 4em); max-width:60px; margin:auto; }
.Content__section section.aroma-use li p {
width:100%;
margin-top:.4em;
text-align:center;
font-size:.9em;
font-weight:600;
line-height:1.2em;
color:#555;
}
@media screen and (max-width:400px) {
.Content__section section.aroma-use > img { width:7.2em; }
.Content__section section.aroma-use li { width:8em; height:8em; }
}
@media screen and (max-width:370px) {
.Content__section section.aroma-use > img { width:6em; }
.Content__section section.aroma-use li { width:6.8em; height:6.8em; }
}
.Content__section section.aroma-item {
display:flex;
flex-wrap:wrap;
justify-content:space-between;
align-items:stretch;
}
.Content__section section.aroma-item a {
position:relative;
width:calc(100%/2 - .2em);
padding:.8em .4em 2.2em;
font-feature-settings:'palt';
color:#333;
background:#f7f7f7;
}
.Content__section section.aroma-item a:nth-of-type(n+3) { margin-top:.4em; }
.Content__section section.aroma-item a:hover { background:#fafafa; }
.Content__section section.aroma-item a:before,
.Content__section section.aroma-item a:after {
position:absolute;
display:block;
color:#0085cd;
font-size:.9em;
}
.Content__section section.aroma-item a:before {
bottom:.8em;
right:1.8em;
content:'\8A73\3057\304F\306F\3053\3061\3089';
width:100%;
margin-top:.4em;
text-align:right;
}
.Content__section section.aroma-item a:after {
bottom:1em;
right:1em;
content:'';
width:.4em;
height:.4em;
border-top:1px solid;
border-right:1px solid;
transform:translate(-25%,-50%) rotate(45deg);
}
.Content__section section.aroma-item a > * { display:block; }
.Content__section section.aroma-item a img {
width:5em;
height:5em;
padding:.4em;
background:#fff;
border-radius:50%;
object-fit:contain;
}
.Content__section section.aroma-item a p { width:calc(100% - 5.4em); margin-left:.4em; }
@media screen and (min-width:501px) {
.Content__section section.aroma-item a {
display:flex;
flex-wrap:wrap;
justify-content:flex-start;
align-content:center;
align-items:center;
}
}
@media screen and (max-width:500px) {
.Content__section section.aroma-item a > * { margin:auto; }
.Content__section section.aroma-item a p { width:100%; margin:.4em auto 0; font-size:.9em; }
.Content__section section.aroma-item a p br { display:none; }
}
#author-box { width:100%; max-width:800px; margin:2em auto; }
#author-box .sab-edit-settings,
#author-box .saboxplugin-socials.sabox-colored { display:none; }
.Section__block {
margin-top: 24px;
padding: 0 16px;
}
.Section__block .Block__ttl, .Section__block .Block__text {
line-height: 2;
word-break: break-all;
}
.Section__block .Block__text strong {
font-weight:700;
}
.Section__block .Block__text strong.pink_line {
font-weight:400;
}
.Section__block .Block__ttl {
margin-top: 32px;
font-weight: bold;
}
.Section__block blockquote { position:relative; padding:2em; line-height:1.4em; background:#f2f1ee; }
.Section__block blockquote:before,
.Section__block blockquote:after { position:absolute; content:''; width:1.8em; height:1.8em; background:url(https://aromicstyle.com/img/icon/quote.png) center / 100% no-repeat; opacity:.9; }
.Section__block blockquote:before { top:.4em; left:.4em; transform:rotate(180deg); }
.Section__block blockquote:after { bottom:.4em; right:.4em; }
.Section__block .btn-box {
display:inline-block;
margin:auto;
padding:.4em 1em .2em;
text-align:center;
text-decoration:none;
color:#fff;
background:#4db87b;
box-shadow:0 .3em 0 #369b61;
border-radius:.6em;
transition:.4s;
}
.Section__block .btn-box:hover { position:relative; bottom:-.2em; box-shadow:none; } .buy-link { display:flex; flex-wrap:wrap; font-size:16px; }
.buy-link > br, .buy-link > .box > br { display:none; }
.buy-link > .box { display:flex; flex-wrap:wrap; align-items:flex-start; width:100%; margin-bottom:1em; padding:1.2em; border:.6em solid #f3f3f3; }
.buy-link > .box:nth-of-type(n+2) { margin-top:1.6em; }
.buy-link > .box * { transition:.4s; }
.buy-link > .box a:first-of-type { display:flex; flex-wrap:wrap; align-items:flex-start; width:100%; }
.buy-link > .box a > picture,
.buy-link > .box a img { width:200px; border:1px solid #f3f3f3; }
.buy-link > .box a:first-of-type:hover > img { opacity:.8; }
.buy-link > .box a > p { width:calc(100% - 200px - 1em); margin-left:1em; font-weight:600; line-height:1.4em; color:#333; }
.buy-link > .box a:first-of-type:hover > p { color:#0085cd; }
.buy-link > .box a > p span.price { display:block; margin-top:.4em; text-align:right; font-size:1.06em; font-weight:500; }
.buy-link > .box a:first-of-type:hover > p span.price { color:#333; }
.buy-link > .box a > p span.price + .price { margin-top:0; }
.buy-link > .box a > p span.price:after { content:'税込'; display:inline-block; margin-left:.1em; font-size:12px; }
.buy-link > .box a > p span.price.cost-free:before {
position:relative;
top:-.1em;
content:'送料無料';
margin-right:.3em;
padding:.2em .4em;
font-size:.8em;
background:#f3f3f3;
border-radius:.2em;
}
.buy-link > .box a:not(:first-of-type) {
width:100%;
margin:1em auto 0;
padding:.8em 0;
text-align:center;
font-weight:600;
font-size: 16px;
line-height:1.4em;
color:#217a4b;
background:rgba(33,122,75,.06);
border-radius:.2em;
box-shadow:.12em .12em .2em rgba(70,81,75,.64);
}
.buy-link > .box a:not(:first-of-type)[href*='aromicstyle']:before {
content:'';
display:inline-block;
width:1.6em;
height:1.6em;
margin:0 .4em -.4em 0;
font-size:1.06em;
background:url(https://aromicstyle.com/img/logo/cm-icon.webp) center / 100% no-repeat;
}
.buy-link > .box a[href*='yahoo'] + a:not(:first-of-type)[href*='aromicstyle'],
.buy-link > .box a[href*='rakuten.co.jp/aromaspray'],
.buy-link > .box a[href*='amazon']:not(:first-of-type),
.buy-link > .box a[href*='yahoo']:not(:first-of-type) { width:calc(100%/2 - .2em); margin:.6em 0 0; padding:.6em 0; }
.buy-link > .box a[href*='rakuten.co.jp/aromaspray'],
.buy-link > .box a[href*='amazon']:not(:first-of-type),
.buy-link > .box a[href*='yahoo']:not(:first-of-type) { color:#fff; }
.buy-link > .box a[href*='yahoo'] + a:not(:first-of-type)[href*='aromicstyle'],
.buy-link > .box a[href*='amazon']:not(:first-of-type) { margin-left:.2em; }
.buy-link > .box a[href*='rakuten.co.jp/aromaspray'],
.buy-link > .box a[href*='yahoo']:not(:first-of-type) { margin-right:.2em; }
.buy-link > .box a[href*='yahoo'] + a:not(:first-of-type)[href*='aromicstyle'] { padding:calc(.6em - 1px) 0; background:rgba(33,122,75,.06); border:1px solid; border-left-width:.4em; }
.buy-link > .box a[href*='yahoo'] + a:not(:first-of-type)[href*='aromicstyle']:before { display:none; }
.buy-link > .box a[href*='rakuten.co.jp/aromaspray'] { background:#bf0000; box-shadow:.12em .12em .1em rgba(191,0,0,.2); }
.buy-link > .box a[href*='amazon']:not(:first-of-type) { background:#f08804; box-shadow:.12em .12em .1em rgba(240,136,4,.2); }
.buy-link > .box a[href*='yahoo']:not(:first-of-type) { background:#ff1533; box-shadow:.12em .12em .1em rgba(225,21,51,.2); }
.buy-link > .box a:not(:first-of-type):hover { box-shadow:none; }
.buy-link > .box a[class] { font-weight:500; color:#333; }
.buy-link > .box a.ss { background:#e6f3f5; }
.buy-link > p { width:100%; }
.buy-link > a { display:inline-block; margin:.3em .2em .1em; padding:.4em .6em; font-weight:600; border-radius:.2em; }
.buy-link > a[href*='rakuten.co.jp/aromaspray'],
.buy-link > a[href*='amazon']:not(:first-of-type),
.buy-link > a[href*='yahoo.co.jp/aroma-spray'] { font-size:.9em; border:1px solid; border-left-width:.4em; }
.buy-link > a[href*='rakuten.co.jp/aromaspray'] { color:#bf0000; }
.buy-link > a[href*='amazon']:not(:first-of-type) { color:#f08804; }
.buy-link > a[href*='yahoo.co.jp/aroma-spray'] { color:#ff1533; }
.buy-link > a[href*='https://aromicstyle.com/'] { color:#217a4b; }
@media screen and (max-width:800px) {
.buy-link > .box a > picture,
.buy-link > .box a img { width:28vw; }
.buy-link > .box a > p { width:calc(100% - 28vw - 1em); }
}
@media screen and (max-width:500px) {
.Section__block blockquote { padding:2em 1.2em; }
.buy-link { justify-content:center; }
.buy-link > .box { padding:1.2em; }
.buy-link > .box:nth-of-type(n+2) { margin-top:1em; }
.buy-link > p { text-align:center; }
}
@media screen and (max-width:400px) {
.Section__block .btn-box { font-size:.9em; }
.buy-link > .box { font-size:14px; }
}
@media screen and (max-width:370px) {
.buy-link > .box { padding:.8em; }
.buy-link > .box a > picture,
.buy-link > .box a img { width:100px; }
.buy-link > .box a > p { width:calc(100% - 100px - .6em); margin-left:.6em; }
}
@media screen and (max-width:320px) {
.buy-link > .box a:not(:first-of-type) { font-size:14px; }
}  a.buy-link {
display:inline-block;
width:calc(50% - .2em);
margin:1em auto 0;
padding:.6em 0;
text-align:center;
font-size:.96em;
font-weight:600;
line-height:1.6em;
color:#fff;
background:#aaa;
border-radius:.1em;
box-shadow:.2em .2em .2em rgba(5,105,13);
transition:.4s;
}
a.buy-link[href*='rakuten.co.jp/aromaspray'],
a.buy-link[href*='yahoo.co.jp/aroma-spray'] { margin-right:.4em; }
a.buy-link.aromic { background:#02bb80; box-shadow:.2em .2em .2em rgba(5,105,13); }
a.buy-link[href*='rakuten.co.jp/aromaspray'] { background:#bf0000; box-shadow:0 4px 0 #7e0000; }
a.buy-link[href*='amazon'] { background:#f08804; box-shadow:0 4px 0 #b36400; }
a.buy-link[href*='yahoo.co.jp/aroma-spray'] { background:#ff1533; box-shadow:0 4px 0 #af0117; }
a.buy-link:hover { box-shadow:none; }
@media screen and (max-width:768px) {
a.buy-link { width:100%; margin-right:0; }
} .Content__paging {
overflow: hidden;
*zoom: 1;
margin-top: 32px;
}
.Content__paging .Content__paging--prev {
float: left;
}
.Content__paging .Content__paging--next {
float: right;
} .Content__goods {
margin-top: 48px;
height: auto;
width: auto;
overflow: auto;
position: relative;
}
.Content__goods .Content__goods__list {
margin-top: 16px;
display: inline-block;
}
.Content__goods li {
height: auto;
margin-bottom: 0;
}
.Content__goods .Entry__img img {
height: 128px;
}
.Content__goods .Entry__cont {
height: auto;
min-height: 120px;
padding: 8px 8px 40px;
}
.Content__goods .Entry__ttl {
font-size: 1.4rem;
font-weight: bold;
}
.Content__goods .Entry__price {
font-size: 1.2rem;
font-weight: bold;
color: #848280;
margin-top: 1em;
}
.Content__goods + .Sns_btn {
margin-top: 40px;
text-align: right;
}
.goods-prev, .goods-next {
display: inline-block;
position: absolute;
height: 26px;
width: 13px;
top: 160px;
}
.goods-prev:before, .goods-next:before {
content: '';
width: 12px;
height: 12px;
border: 0px;
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
position: absolute;
top: 0;
}
.goods-prev {
left: 4px;
}
.goods-prev:before {
border-bottom: solid 2px #5F5F5F;
border-left: solid 2px #5F5F5F;
left: 0;
}
.goods-next {
right: 4px;
}
.goods-next:before {
border-top: solid 2px #5F5F5F;
border-right: solid 2px #5F5F5F;
right: 0;
} .contact__sns {
-js-display: flex;
display: flex;
justify-content: space-between;
margin: 72px 0 24px;
}
.contact__sns > section {
width: 49%;
text-align: center;
}
.contact__sns .sns_line {
background: #F4FBF2;
box-shadow: 2px 2px 2px #ced5cc;
padding: 24px;
}
.contact__sns .sns_line .sns_line__ttl {
color: #89CC74;
font-size: 2rem;
line-height: 1;
}
.contact__sns .sns_line a {
display: block;
}
.contact__sns .sns_line p {
font-size: 1.6rem;
color: #FFFFFF;
margin-top: 1em;
padding: .8em 1em;
background: #89CC74;
line-height: 1.8;
}
.contact__sns .sns_line .sns_line__btn {
font-size: 1.2rem;
position: relative;
margin-top: 1em;
text-align: right;
padding-right: 1em;
}
.contact__sns .sns_line .sns_line__btn:after {
position: absolute;
top: 50%;
right: 0;
content: '';
display: block;
width: 6px;
height: 6px;
border-top: 1px solid;
border-right: 1px solid;
transform: translate(-25%, -50%) rotate(45deg);
}
.contact__sns #index_mail {
background: #EDEDED;
box-shadow: 2px 2px 2px #d6d6d6;
}
.contact__sns #index_mail dt {
background: #5B504F;
padding: 14px;
}
.contact__sns #index_mail dt p {
font-size: 1.6rem;
color: #fff;
line-height: 1.4;
}
.contact__sns #index_mail dt a {
display: inline-block;
font-size: 1.2rem;
color: #fff;
text-decoration: underline;
position: relative;
margin-top: .8em;
padding-right: 1em;
}
.contact__sns #index_mail dt a:after {
position: absolute;
top: 50%;
right: 0;
content: '';
display: block;
width: 6px;
height: 6px;
border-top: 1px solid;
border-right: 1px solid;
transform: translate(-25%, -50%) rotate(45deg);
}
.contact__sns #index_mail dd {
padding: 16px 16px 0;
position: relative;
}
.contact__sns #index_mail dd:before {
color: #5B504F;
content: "■";
font-size: 16px;
position: absolute;
top: 0;
line-height: 1;
width: 16px;
right: 0;
left: 0;
bottom: auto;
margin: auto;
transform: translate(-25%, -50%) rotate(45deg);
}
.contact__sns #index_mail dd p {
font-size: 1.6rem;
color: #5B504F;
}
.contact__sns #index_mail dd form {
-js-display: flex;
display: flex;
width: 100%;
justify-content: space-between;
}
.contact__sns #index_mail dd input {
margin-top: 8px;
}
.contact__sns #index_mail dd input.text1 {
font-size: 1.6rem;
border: 0;
padding: 0 6px;
-moz-border-radius: 8px 0 0 8px;
-webkit-border-radius: 8px;
border-radius: 8px 0 0 8px;
width: 100%;
}
.contact__sns #index_mail dd input.button1 {
background: #5B504F;
color: #fff;
font-size: 1.6rem;
padding: 4px 12px 4px;
-moz-border-radius: 0 8px 8px 0;
-webkit-border-radius: 0;
border-radius: 0 8px 8px 0;
} .Content__page .Entry__ttl {
margin-top: 24px;
}
.Content__page .Content__section {
margin-top: 32px;
}
.Content__page .Section__text {
font-size: 1.6rem;
margin-top: 1em;
}
.Content__page .Section__info {
font-size: 1.6rem;
margin-top: 1em;
}
.Content__page .Section__info:first-of-type {
margin-top: 2em;
}
.Content__page .Section__info a {
color: #0085cd;
} .Content__archive > .Entry__ttl {
margin-top: 24px;
} .Content__form {
padding: 0 20px;
font-weight: 500;
}
.Content__form input, .Content__form select, .Content__form textarea {
width: 100%;
font-size: 1.6rem;
padding: .5em;
margin-top: .2em;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
border: 1px solid #BCB9AD;
line-height: 1;
}
.Content__form select {
-webkit-appearance: button;
-moz-appearance: button;
appearance: button;
}
.Content__form input[type=checkbox] {
width: auto;
}
.Content__form input[type=checkbox] + span {
font-size: 1.8rem;
cursor: pointer;
}
.Content__form input[type=submit], .Content__form input[type=button] {
width: auto;
margin: 40px 10px 0;
}
.Content__form dl {
margin-top: 1.5em;
}
.Content__form dt {
font-size: 1.6rem;
}
.Content__form dd p {
margin-top: .2em;
}
.Content__form .req {
font-size: 1.2rem;
color: #af3f3f;
}
.Content__form .Content__form__submit {
text-align: center;
}
.Content__form .Content__form__submit input {
padding: 1em;
background: #F4F4F4;
border: none;
cursor: pointer;
-webkit-transition: 0.1s;
-moz-transition: 0.1s;
transition: 0.1s;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
.Content__form .Content__form__submit input:hover {
background: #dbdbdb;
}
.Content__form .Content__form__submit input:disabled {
background: #dbdbdb;
}
.Content__form .Content__form__confirm {
background: #F4F4F4;
padding: 20px;
margin: 40px 20px 0;
border-radius: 5px;
}
.Content__form .Content__form__confirm dt {
border-bottom: 1px solid #BCB9AD;
padding-bottom: .5em;
}
.Content__form .Content__form__confirm dt span {
margin-left: .5em;
font-size: 90%;
}
.Content__form .Content__form__confirm dd {
margin-top: 1em;
text-indent: -1em;
padding-left: 1em;
}
.Content__form span.wpcf7-not-valid-tip {
color: #af3f3f;
}
.Content__form .wpcf7-not-valid {
background: #edcdcd;
}
.Content__form .wpcf-7-mail-sent-ok {
display: none !important;
}
.Content__form .wpcf7c-conf {
background: #eae9e5;
}
.Content__form div.wpcf7-validation-errors, .Content__form div.wpcf7-acceptance-missing {
border: none;
color: #af3f3f;
text-align: center;
}
.Content__form div.wpcf7-response-output {
margin-top: 40px;
}
#lean_overlay {
display: none;
position: fixed;
z-index: 100;
top: 0px;
left: 0px;
height: 100%;
width: 100%;
background: #000;
}
.modal {
display: none;
width: auto;
max-width: 800px;
padding: 2em;
background: #FFF;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
position: absolute;
top: 50%;
}
.modal p, .modal dl {
font-size: 110%;
font-weight: 500;
line-height: 1.6em;
}
.modal p, .modal dd {
padding-left: 1em;
text-indent: -1em;
}
.modal dl {
margin: .5em auto;
}
.modal dt {
margin: .5em 0 .2em;
font-weight: 700;
}
.modal dt:first-of-type {
margin-top: 0;
}
.modal#modal-address dt + dd {
margin-bottom: .5em;
padding: .5em .5em .5em 1.5em;
background: #f5f5f5;
}
.Page__form {
width: 780px;
float: none;
margin: auto;
padding-bottom: 40px;
}
.Content__form .Content__form__delay {
padding: .5em 1em;
text-align: center;
background: #FFF3D3;
border-radius: 50px;
}
.Content__form .Content__form__delay strong {
font-weight: 700;
}
.Content__form .Content__form__info {
padding: 1em;
line-height: 1.5em !important;
background: #fffbf2;
border-radius: 5px;
box-sizing: border-box;
}
.Content__form .Content__form__info dt {
padding-bottom: .5em;
border-bottom: 1px solid #BCB9AD;
}
.Content__form .Content__form__info dd {
margin-top: .5em;
padding-left: 2em;
text-indent: -2em;
}
.Content__form .Content__form__info dd:first-of-type {
margin-top: 1em;
}
.Content__form .Content__form__info dd:before {
margin-right: .4em;
padding-right: .1em;
letter-spacing: 2px;
}
.Content__form .Content__form__info dd:nth-of-type(1):before {
content: "1.";
}
.Content__form .Content__form__info dd:nth-of-type(2):before {
content: "2.";
}
.Content__form .Content__form__info dd:nth-of-type(3):before {
content: "3.";
}
.Content__form .Content__form__info dd:nth-of-type(4):before {
content: "4.";
}
.Content__form .Content__form__info dd:nth-of-type(5):before {
content: "5.";
}
.Content__form .Content__form__info dd:nth-of-type(6):before {
content: "6.";
}
.Content__form .Content__form__info dd:nth-of-type(7):before {
content: "7.";
}
.Content__form .Content__form__info dd:nth-of-type(8):before {
content: "8.";
}
.Content__form .Content__form__info dd:nth-of-type(9):before {
content: "9.";
}
.Content__form .Content__form__info dd:nth-of-type(10):before {
content: "10.";
} .Footer {
background: #BCB9AD;
}
.Footer p, .Footer a {
color: #fff;
}
.Footer .Footer__inner {
height: 130px;
-js-display: flex;
display: flex;
align-items: center;
}
.Footer .Footer__list {
-js-display: flex;
display: flex;
}
.Footer .Footer__list p {
margin-right: 32px;
font-size: 1.26rem;
}
.Footer .Footer__list p a { display:inline-block; padding:.4em; }
.Footer .Footer__logo {
text-align: center;
margin-left: auto;
}
.Footer .Footer__copy {
margin-top: 12px;
}
 button {
border: none;
cursor: pointer;
outline: none;
padding: 0;
appearance: none;
}
input[type="submit"], input[type="button"] {
border-radius: 0;
-webkit-box-sizing: content-box;
-webkit-appearance: button;
appearance: button;
border: none;
box-sizing: border-box;
cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration, input[type="button"]::-webkit-search-decoration {
display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
outline-offset: -2px;
}
@media screen and (min-width:668px) {
.Header .Header__left .link-box { display:none; }
}
@media screen and (max-width: 667px) {
html, body {
min-width: 100%;
width: 100%;
border: 0;
}
a, button {
cursor: pointer;
}
a:hover, button:hover {
opacity: 1;
filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false);
opacity: 1;
zoom: 1;
}
.pc {
display: none !important;
}
.Header__left, .Content, .Footer__inner {
width: 100%;
padding: 0 20px;
}
.Header, .Content__left, .Content__right {
width: 100%;
} .Header { position:absolute; top:-70px; height:70px; margin: 0; }
.Header .Header__logo { margin-top:3.4em; line-height:1; }
.Header .Header__logo a { display:block; margin-bottom:1.2em; }
.Header .Header__logo img { width:150px; }
.Header .Header__left {
border-top: 4px solid #BCB9AD;
width: 100%;
height: 100%;
-js-display: flex;
display: flex;
justify-content: space-between;
align-items: center;
position: relative;
z-index: 20;
background: #fff;
}
.Header .Header__left > p:not([class]) { position:absolute; top:.4em; left:2vw; line-height:2.2em; }
.Header .Header__left > p:not([class]) img { height:2.2em; margin:0 .2em; }
.Header .Header__left .link-box { display:flex; justify-content:space-between; width:9em; margin:0 1.4em 0 auto; }
.Header .Header__left .link-box a { display:block; width:calc(100%/2 - .2em); padding:.2em 0; background:#f3f8f4; }
.Header .Header__left .link-box p { text-align:center; font-size:12px; letter-spacing:.06em; color:#32693e; }
.Header .Header__left .link-box svg { display:block; width:1.8em; margin:0 auto .2em; fill:#32693e; }
.Header .Header__nav_btn,
.Header .Header__nav_btn span {
display: inline-block;
transition: all .4s;
box-sizing: border-box;
}
.Header .Header__nav_btn {
position: relative;
min-width: 24px;
width: 24px;
height: 20px;
}
.Header .Header__nav_btn span {
position: absolute;
left: 0;
width: 100%;
height: 2px;
background-color: #5F5F5F;
}
.Header .Header__nav_btn span:nth-of-type(1) {
top: 0;
}
.Header .Header__nav_btn span:nth-of-type(2) {
top: 20px;
}
.Header .Header__nav_btn span:nth-of-type(3) {
bottom: 8px;
}
.Header .Header__nav_btn.active span:nth-of-type(1) {
-webkit-transform: translateY(10px) rotate(-45deg);
transform: translateY(10px) rotate(-45deg);
}
.Header .Header__nav_btn.active span:nth-of-type(2) {
opacity: 0;
}
.Header .Header__nav_btn.active span:nth-of-type(3) {
-webkit-transform: translateY(0) rotate(45deg);
transform: translateY(0) rotate(45deg);
}
.Header .Header__nav--sp {
position: absolute;
width: 100%;
background: #fff;
top: 70px;
z-index: 10;
}
.Header .Header__nav--sp > ul {
-js-display: flex;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}
.Header .Header__nav--sp .Header__nav__list {
width: 50%;
text-align: center;
}
.Header .Header__nav--sp .Header__nav__list:nth-child(1), .Header .Header__nav--sp .Header__nav__list:nth-child(4), .Header .Header__nav--sp .Header__nav__list:nth-child(5) {
background-color: #F4F4F4;
}
.Header .Header__nav--sp .Header__nav__list a {
display: block;
font-weight: bold;
color: #5F5F5F;
padding: 32px 0 32px 10px;
background-repeat: no-repeat;
background-position: left 20px center;
}
.Header .Header__nav--sp .Header__nav--repellant {
background-position: left 30px center;
}
.Header .Header__nav--sp .Header__about {
margin-top: 0;
}
.Header .Header__nav--sp .Header__about a {
font-weight: normal;
height: auto;
float: none;
line-height: 1.4;
padding: 24px 0;
margin: 0;
background: #fff;
}
.Header .Header__nav--sp .Header__about a:before {
left: 14px;
}
.overlay {
background-color: rgba(0, 0, 0, 0.6);
display: none;
position: fixed;
z-index: 5;
top: 0;
left: 0;
height: 100%;
width: 100%;
}
.Sns_btn {
width: 248px;
margin: 24px auto;
} .Content__goods .Content__goods__list {
margin-top: 16px;
display: inline-block;
}
.Content__goods .Entry__img img {
height: 112px;
}
.Content__goods .Entry__cont {
min-height: 104px;
padding: 8px 8px 24px;
}
.Content__goods .Entry__price {
margin-top: 8px;
}
.Content__goods + .Sns_btn {
margin-top: 24px;
}
.Content__goods .bx-wrapper {
margin: 0 16px;
}
.Content__goods .goods-prev, .Content__goods .goods-next {
top: 140px;
}
.searchform {
margin: 16px 5%;
width: 90%;
} .Content {
margin: 70px 0 32px; padding-top:.6em;
}
.Breadcrumb {
font-size: 12px;
line-height: 1.6;
} .Top_entry, .Recommend_entry {
width: 100%;
height: auto;
}
.Top_entry li, .Recommend_entry li {
height: auto;
}
.Top_entry .Entry__img img, .Recommend_entry .Entry__img img {
height: 214px;
}
.Top_entry .Entry__cont, .Recommend_entry .Entry__cont {
padding: 24px 24px 56px;
}
.Top_entry .Entry__ttl, .Recommend_entry .Entry__ttl {
font-size: 2rem;
}
.bx-next, .bx-prev {
height: 20px;
width: 20px;
}
.btn-prev, .btn-next {
height: 20px;
width: 12px;
top: 190px;
}
.btn-prev:before, .btn-next:before {
width: 12px;
height: 12px;
border: 0px;
}
.btn-prev {
left: -13px;
}
.btn-prev:before {
border-bottom: solid 2px #5F5F5F;
border-left: solid 2px #5F5F5F;
left: 0;
}
.btn-next {
right: -10px;
}
.btn-next:before {
border-top: solid 2px #5F5F5F;
border-right: solid 2px #5F5F5F;
right: 0;
} .New_entry, .Rank_entry {
margin-top: 32px;
}
.New_entry .Entry__img, .Rank_entry .Entry__img {
width: 120px;
min-width: 120px;
height: 76px;
}
.New_entry .Entry__img img, .Rank_entry .Entry__img img {
height: 76px;
}
.New_entry .Entry__cont, .Rank_entry .Entry__cont {
width: 100%;
padding-left: 12px;
}
.New_entry .Entry__ttl, .Rank_entry .Entry__ttl {
font-size: 1.4rem;
line-height: 1.2;
}
.New_entry .Entry__cat, .Rank_entry .Entry__cat, .New_entry .Entry__date, .Rank_entry .Entry__date {
margin-top: 8px;
}
.New_entry .Entry__cat, .Rank_entry .Entry__cat {
font-size: 1.2rem;
} .Rank_entry .Entry__cont {
width: 100%;
}
.Rank_entry .Entry__img .Entry__num {
font-size: 1.2rem;
} .Recommend_entry {
margin-top: 32px;
height: auto;
width: auto;
overflow: auto;
}
.Recommend_entry .Recommend_entry__list {
-js-display: flex;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
margin-top: 16px;
}
.Recommend_entry li {
height: auto;
width: 49%;
margin-bottom: 8px;
}
.Recommend_entry .Entry__img img {
height: 94px;
}
.Recommend_entry .Entry__cont {
padding: 12px 10px 14px;
}
.Recommend_entry .Entry__ttl {
font-size: 1.2rem;
}
.Recommend_entry .Entry__cat, .Recommend_entry .Entry__date {
margin-top: 8px;
font-size: 1rem;
}
.Recommend_entry .Entry__cat {
padding: 0 2px;
height: 16px;
line-height: 16px;
}
.Recommend_entry .Entry__date {
padding-left: 4px;
} .Content__entry {
margin-top: 16px;
}
.Entry__ttl {
font-size: 2.4rem;
}
.Entry__head {
display: block;
margin-top: 16px;
}
.Entry__head .Entry__head__inner {
width: 100%;
display: block;
}
.Entry__head .Sns_btn {
margin: 8px 0 0;
}
.Section__catch {
margin-top: 32px;
padding: 0;
}
.Entry__contents {
margin-top: 32px;
padding: 24px 32px;
}
.Content__section {
margin-top: 24px;
}
.Content__section#Entry__section--1 {
margin-top: 48px;
}
.Content__section .Section__ttl {
margin-top: 24px;
}
.Content__section .Section__text {
padding: 0;
}
.Content__section .Section__img {
margin-top: 24px;
width: 100%;
padding: 0;
}
.Section__block {
padding: 0;
}
.Section__block .Block__ttl {
margin-top: 24px;
font-weight: bold;
} .Content__about .Content__section {
margin-top: 24px;
}
.Content__about .Section__text {
padding: 0;
} .company_about {
margin-bottom: 32px;
}
.company_about > div > div:first-child {
padding: 16px;
}
.company_about .company_about__bg {
width: 30%;
}
.company_about .company_about__catch {
font-size: 4vw;
margin-top: 0;
}
.company_about .company_about__txt {
font-size: 3vw;
line-height: 1.6;
}
.company_about > a {
font-size: 4.4vw;
}
.company_about + .New_entry, .company_about + .Rank_entry {
margin-bottom: 32px;
} .contact__sns {
display: block;
margin: 48px 0 24px;
}
.contact__sns > section {
width: 100%;
}
.contact__sns > section + section {
margin-top: 16px;
}
.contact__sns .sns_line {
padding: 16px;
}
.contact__sns .sns_line p {
font-size: 4vw;
}
.contact__sns #index_mail dt p, .contact__sns #index_mail dd p {
font-size: 4.2vw;
line-height: 1.6;
}
.contact__sns #index_mail dd {
padding: 16px;
} .Content__archive > .Entry__ttl {
margin-top: 16px;
}
.Content__archive .New_entry, .Content__archive .Rank_entry {
margin-top: 24px;
}
.Content__archive + .Content__right .Rank_entry {
margin-top: 0;
} .Footer .Footer__inner {
display: block;
height: auto;
padding: 32px 32px 40px;
}
.Footer .Footer__list {
flex-wrap: wrap;
justify-content: space-around;
}
.Footer .Footer__list p {
margin: .5em;
}
.Footer .Footer__logo {
margin-top: 40px;
}
.Footer .Footer__copy {
margin-top: 32px;
}
}
@media screen and (max-width:320px) {
.Header .Header__left { padding:0 10px; }
.Header .Header__left .link-box { width:8em; margin-right:.6em; }
}
.Sns_btn {
display:flex;
flex-wrap:wrap;
justify-content:flex-end;
align-items:center;
width:100%;
}
.Sns_btn > iframe { margin-left:5px; }
@media screen and (max-width:667px) {
.Sns_btn { width:calc(100% - 2em); }
} .sns_link {
display:flex;
flex-wrap:wrap;
justify-content:center;
align-items:center;
padding:.6em 1em;
background:#f4f4f4;
box-sizing:border-box;
}
.Header__right.pc > .sns_link { justify-content:flex-end; padding:0; background:none; }
.Header__nav--sp.sp > .sns_link { font-size:1.1em; background:none; }
.Content__entry + .sns_link { margin-top:1em; font-size:1.1em; }
.sns_link h2 { margin:0 1em 0 0;}
.sns_link ul {
display:flex;
flex-wrap:wrap;
justify-content:center;
width:7.4em;
margin:0;
}
.sns_link li { margin-right:.6em; }
.sns_link li:first-of-type { margin-right:.9em; }
.sns_link li:last-of-type { margin-right:0; }
.sns_link a { display:block; }
.sns_link a:hover {  opacity:.4; }
.sns_link svg { display:block; width:1.2em; height:1.2em; margin:auto; }
.sns_link li:first-of-type svg { width:1.3em; height:1.3em; }
svg.line { fill:#31ae36; }
svg.instagram { fill:#e4405f; }
svg.facebook { fill:#3c5a9a; }
svg.twitter { fill:#45b0e4; }
svg.youtube { fill:#e3403e; }
@media screen and (min-width:668px) {
.sns_link h2 { display:none; }
}
@media screen and (max-width:667px) {
.Entry__head > .sns_link { margin-top:1em; }
}
@media screen and (max-width:370px) {
.sns_link { font-size:.9em; }
} .popular {
padding:.6em 1em;
background:#f4f4f4;
box-sizing:border-box;
}
.popular h2 { margin:0 1em 0 0;color:#d02929;}
.popular h2 a{ text-decoration:underline;color:#0085cd;}
@media screen and (max-width:667px) {
.Entry__head > .popular { margin-top:1em; }
}
@media screen and (max-width:370px) {
.popular { font-size:.9em; }
}