@charset "utf-8";
 .br-sp {
display: none;
}
.contents {
width: 100%;
max-width: 1240px;
margin: 0 auto;
padding: 0;
box-sizing: border-box;
}
.contents h2 {
font-size: 1.75rem;
font-weight: 400;
line-height: 1.6;
display: block;
width: 100%;
}
.contents h2 span {
font-size: .875rem;
}
.contents h4 {
width: 100%;
display: block;
}
.btn {
text-align: center;
margin: 0 auto;
}
.btn a {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
max-width: 200px;
text-align: center;
padding: 0.8em 1em;
margin: 1em auto;
border-radius: 45px;
color: #fff;
background: #189800;
box-shadow: 3px 3px 6px 0px rgb(0 0 0 / 18%);
letter-spacing: 1.1px;
}
.btn a::before {
display: inline-block;
position: relative;
content: url(//jclcp.com/wp-content/themes/jclcp/img/btn.svg);
width: 25px;
height: 25px;
top: 0;
right: 8px;
} .page-contents {
width: 100%;
max-width: 960px;
margin: 0 auto;
padding: 3em 0 0;
}
.article-main {}  #news {}
#news .article-item .txt-wrap {
display: flex;
justify-content: center;
}
#news .txt-wrap-date {
padding-right: 2em;
}
#news .article-item .txt-wrap-date span {
line-height: 1;
margin: 0 auto 0.5em;
}
#news .article-item .txt-wrap-date span.article-date {
padding-right: 1em;
}
#news .article-item .txt-wrap-date span.article-cat {
border-left: 1px solid #666;
padding-left: 1em;
}
.article-item .img-wrap {
line-height: 0;
margin: 0 auto 0.5em;
}
.article-item .txt-wrap-date {
margin: 0 auto 0.8em;
}
.article-item .txt-wrap h2 {
font-size: 1rem!important;
}  .mv {
display: block;
}
.mv-sp {
display: none;
}
.mv-box {
position: relative;
}
.mv-txt {
width: 100%;
position: absolute;
top: 50%;
left: 50%;
-ms-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
z-index: 150;
color: #fff;
text-align: center;
}
.mv-txt h2 {
font-family: '游明朝', 'Yu Mincho', YuMincho, 'Hiragino Mincho Pro', serif!important;
font-size: 3.4em;
font-weight: 400;
letter-spacing: 1.1px;
margin: 0 auto 0.3em;
}
.mv-txt p {
font-family: '游明朝', 'Yu Mincho', YuMincho, 'Hiragino Mincho Pro', serif!important;
font-size: 1.2em;
font-weight: 500;
letter-spacing: 5px;
margin: 0 auto;
} .slick-initialized .slick-slide {
margin: 0 0.5em;
}
.slick-slide img {
display: block;
width: 100%;
}
.slick-prev {
left: 30px!important;
}
.slick-next {
right: 30px!important;
}
.slick-prev:before,
.slick-next:before {
font-size: 36px!important;
opacity: 0.9!important;
border: 1px solid #fff;
border-radius: 100%;
padding: 0.3em;
}
.slick-prev,
.slick-next {
width: 50px;
height: 30px;
z-index: 100;
}
.dots-wrap {
display: flex;
justify-content: center;
list-style: none !important;
}
.dots-wrap li {
width: 8px;
height: 8px;
margin: 1em 0.5em;
background: #ccc;
border-radius: 50%;
cursor: pointer;
}
.dots-wrap li:hover,
.dots-wrap li.slick-active {
background: #333;
}
.dots-wrap li button {
display: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
outline: none;
padding: 0;
border: none;
background-color: transparent;
} #top .contents-box {
display: block;
}
#top .contents-box .main-contents {
width: 100%;
max-width: 1080px;
margin: 0 auto;
box-sizing: border-box;
}
.top-contents {
margin: 0 auto 10em;
}
#top .main-contents h2 {
font-size: 1.75rem;
font-weight: 600;
text-align: center;
letter-spacing: 1.1px;
margin: 0 auto 0.8em;
} #top .top-news-contents {
margin: 0 auto 8em;
background: #f2f2f2;
border-radius: 20px;
padding: 3em 3em 2em;
}
#top .top-news-txt { 
margin: 0 auto 3em;
}
#top .top-news-list a {
display: block;
background: #fff;
border-radius: 5px;
margin: 0 auto 0.8em;
padding: 0.8em 3em;
}
#top .top-news-list a p.date {
margin: 0;
padding: 0.3em 0 0;
line-height: 1.5;
font-weight: 600;
}
#top .top-news-list a p.news-ttl {
margin: 0 auto;
font-size: 1rem;
}
#top .top-news-list a p.news-ttl::before {
display: inline-block;
position: relative;
content: url(//jclcp.com/wp-content/themes/jclcp/img/btn.svg);
width: 25px;
height: 25px;
top: 7px;
right: 3px;
} .top-product-box {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 0 auto 3em;
}
.top-product-box:after {
content: "";
display: block;
width: 23%;
height: 0;
}
#top .top-product-ttl {
margin: 0 auto 3em;
}
.top-product-ttl p {
text-align: center;
}
#top .top-product-box .product-article-item {
width: calc(100% / 5 - 1em);
}
.top-product-box .product-article-item .txt-wrap {
padding: 0 0.5em;
}
#top .top-product-box .product-article-item .txt-wrap h3 {
font-size: 1rem;
}
.top-product-box .product-article-item .txt-wrap ul li { line-height: 1.6;
}
.top-product-box.product-article-item .txt-wrap ul li.price {
font-size: 1rem;
}
.top-product-box .product-article-item .txt-wrap ul li span {
font-size: 0.75rem;
} .top-product-list {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.top-product-list:after {
content: "";
display: block;
width: 32%;
height: 0;
}
.top-product-list li {
width: 32%;
margin: 0 0 1.5em;
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.08);
}
.top-product-list .product-img {
margin: 0 auto 1em;
}
.top-product-txt {
padding: 0 1.5em 1em;
}
.top-product-txt .product-name {
text-align: center;
margin: 0 auto 0.5em;
}
.top-product-txt .product-name img {
width: 90%;
} #news .article-box {
margin: 0 auto 5em;
}
#news .txt-wrap .news-img {margin: 0 auto 2em;}
#news .txt-wrap .news-img img {width: 25%;}
.news-contact {
padding: 2em 0;
margin: 0 auto;
}
.news-contact h3 {
font-weight: 400;
font-size: 1.25rem;
border-left: 3px solid #333;
margin: 0 auto 0.5em;
padding: 0 0 0 0.5em;
}
.news-contact p {
margin: 0 auto 2em;
} #news .related-links {
padding: 2em 3em;
background: #f3f2ef;
border-radius: 8px;
margin: 3em auto 0;
} #product .product-list {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
box-sizing: border-box;
gap: 1.6em;
}
#product .product-item {
width: 23%;
margin-bottom: 2em;
}
#product .product-item::after{
content:"";
display: block;
width: 20%;
}
#product .product-item .img-wrap {
line-height: 0;
margin: 0 auto 0.8em;
}
#product .product-item .txt-wrap {
padding: 0 0.5em 0;
}
#product .product-item .txt-wrap h3 {
font-size: 1rem;
line-height: 1.6;
margin: 0 auto;
}
#product .product-item .txt-wrap li.price {
font-size: 1rem;
}
#product .product-item .txt-wrap li span {
font-size: 0.75rem;
} #product .category-list .category-box {
margin: 0 auto 3em;
}
#product .product-contents h2,
#product .category-list .category-box h2 {
font-size: 1.5rem;
font-weight: 600;
padding: 0 0 0.5em;
border-bottom: 1px solid #c2c2c2;
}
#product .product-contents h2::before,
#product .category-list .category-box h2::before {
display: inline-block;
position: relative;
content: url(//jclcp.com/wp-content/themes/jclcp/img/book02.svg);
width: 50px;
height: 50px;
top: 16px;
padding-right: 0.5em;
} #product .product-box {}
#product .item-main {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
margin: 0 auto 5em;
}
#product .item-img {
width: 28%;
}
#product .item-img img {
width: 100%;
}
#product .item-txt {
width: 68%;
}
#product .item-txt p.series {margin: 0 auto 0.2em;}
#product .item-txt h2 {
font-size: 1.5rem;
font-weight: 600;
line-height: 1;
margin: 0 auto 0.2em;
}
#product .item-txt p.price {margin: 0 auto 1.5em;}
#product .item-txt p.price span {
font-size: 1.5rem;
padding-right: 0.3rem;
}
#product .item-txt ul {
margin: 0 auto 2em;
}
#product .item-txt li.author {
display: flex;
flex-wrap: nowrap;
}
#product .item-txt .author p {
margin: 0;
}
#product .item-txt .amazon {
position: initial;
margin: 0 auto 2em;
}
#product .item-txt .amazon a {
width: 100%;
padding: 0
}
#product .item-txt .amazon a img {width: 30%;} #download .download-list-box h2 {
text-align: center;
margin: 0 auto 0.1em;
}
#download .download-list-box p {
text-align: center;
margin: 0 auto 2em;
}
#download .note {
width: 100%;
max-width: 620px;
margin: 0 auto 3em;
padding: 2em 3em;
border: 1px solid #333;
}
#download .note ul {
list-style: disc;
margin-left: 1em;
}
#download .download-box {
margin: 0 auto 8em;
}
#download .download-article-list {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
box-sizing: border-box;
margin: 0 auto 3em;
}
#download .download-article-list::after {
content: "";
display: block;
width: 18%;
height: 0;
}
#download .download-article-list .download-article-item {
width: 18.888%;
margin-bottom: 1em;
} #download .download-box .item-main {
display: flex;
flex-wrap: wrap;
}
#download .download-box .item-main .item-img {
width: 100%;
flex: 1;
}
#download .download-box .item-main .item-txt {
width: 100%;
flex: 2;
padding-left: 3em;
} #company {}
#company .message {
margin: 0 auto 5em;
}
#company h2 {
font-size: 1.5rem;
font-weight: 600;
padding: 0 0 0.5em;
border-bottom: 1px solid #c2c2c2;
}
#company .message h2::before {
display: inline-block;
position: relative;
content: url(//jclcp.com/wp-content/themes/jclcp/img/company01.svg);
width: 50px;
height: 50px;
top: 16px;
padding-right: 0.5em;
}
#company .info h2::before {
display: inline-block;
position: relative;
content: url(//jclcp.com/wp-content/themes/jclcp/img/company02.svg);
width: 50px;
height: 50px;
top: 16px;
padding-right: 0.5em;
}
#company .staff h2::before {
display: inline-block;
position: relative;
content: url(//jclcp.com/wp-content/themes/jclcp/img/company03.svg);
width: 50px;
height: 50px;
top: 16px;
padding-right: 0.5em;
}
#company .info {
margin: 0 auto 5em;
}
#company .info h2 {
border: none;
}
#company table th,
#company table td {
border: 1px solid #c2c2c2;
}
#company table th {
width: 20%;
background: #f2f2f2;
}
#company .staff {
margin: 0 auto 5em;
}
#company .map {margin: 1.5em auto 0;}
#company .map iframe {
width: 100%;
height: 300px;
}
#company .staff dl {}
#company .staff dt,
#company .staff dd {
margin: 0 auto 1em;
}
#company .staff dt {
width: 12%;
float: left;
}
#company .staff dd {} input[type="text"],
input[type="tel"],
input[type="email"] {
font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", Noto Sans JP, "Hiragino Sans", Meiryo, sans-serif;
font-size: 0.9375rem;
font-weight: normal;
padding: 0.8em 1em;
border: 1px solid #ddd;
outline: none;
width: 100%;
box-sizing: border-box;
}
input[type="radio" i] {
margin: 0px 3px 3px 10px;
display: inline-block;
margin-right: 8px;
transform: scale(1.5);
accent-color: #189800;
}
input[type="button"] {
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
font-size: 1rem;
font-weight: 400;
width: 300px;
padding: 0.8em 2em;
border: 1px solid #189800;
background: #fff;
color: #189800;
cursor: pointer;
}
input[type="submit"] {
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
font-size: 1rem;
font-weight: 400;
width: 300px;
padding: 0.8em 2em;
border: 1px solid #189800;
background: #189800;
color: #fff;
cursor: pointer;
}
span.wpcf7-spinner {
display: none;
}
textarea {
font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", Noto Sans JP, "Hiragino Sans", Meiryo, sans-serif;
font-size: 0.9375rem;
resize: vertical;
width: 100%;
height: auto;
min-height: 230px;
padding: 1em;
line-height: 1.8;
field-sizing: content;
border: 1px solid #ddd;
box-sizing: border-box;
outline: none;
}
::-webkit-input-placeholder { font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", Noto Sans JP, "Hiragino Sans", Meiryo, sans-serif;
font-size: 0.9375rem;
font-weight: 400;
color: #999;
}
:-ms-input-placeholder { font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", Noto Sans JP, "Hiragino Sans", Meiryo, sans-serif;
font-size: 0.9375rem;
font-weight: 400;
color: #999;
}
::placeholder { font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", Noto Sans JP, "Hiragino Sans", Meiryo, sans-serif;
font-size: 0.9375rem;
font-weight: 400;
color: #999;
}
.wpcf7-list-item {margin: 0;}
.wpcf7-list-item-label {padding-right: 3em;}
#contact {margin: 0 auto 8em;}
#contact .contact-box h2 {
font-size: 1.5rem;
font-weight: 600;
padding: 0 0 0.5em;
border-bottom: 1px solid #c2c2c2;
}
#contact .contact-box h2::before {
display: inline-block;
position: relative;
content: url(//jclcp.com/wp-content/themes/jclcp/img/book02.svg);
width: 50px;
height: 50px;
top: 16px;
padding-right: 0.5em;
}
#contact .contact-box p.contact-txt {
text-align: center;
margin: 0 auto 3em;
}
#contact .contact-box table {
margin: 0 auto 3em;
}
#contact .contact-box table th,
#contact .contact-box table td {
vertical-align: top;
border: none;
}
#contact .contact-box table th {
width: 25%;
text-align: left;
background: #fff;
padding-left: 0;
padding-right: 0;
}
#contact .contact-box table td {
padding-left: 0;
padding-right: 0;
}
#contact .contact-box table th span.must,
#contact .contact-box table th span.may {
color: #fff;
font-size: 0.75rem;
padding: 0.3em 0.5em;
margin-right: 0.8em;
}
#contact .contact-box table th span.must {
background: #DC3535;
}
#contact .contact-box table th span.may {
background: #ccc;
}
#contact .contact-list {
margin: 0 auto 2em;
}
#contact .contact-list h3 {
font-size: 1rem;
padding: 0.5em 1em 0.5em;
background: #f2f2f2;
margin: 0 auto 0.8em;
}
#contact .contact-list h3::before {
display: inline-block;
position: relative;
content: url(//jclcp.com/wp-content/themes/jclcp/img/btn.svg);
width: 25px;
height: 25px;
top: 6px;
padding-right: 0.5em;
}
#contact .contact-list p {
line-height: 1.6;
padding-left: 1em;
}
#contact .contact-list p span {
font-size: 1.25rem;
font-weight: 600;
}
#contact .privacy {
width: 100%;
margin: 0 auto 1em;
}
#contact .privacy-txt {
height: 100%;
max-height: 100px;
overflow: scroll;
padding: 1em 2em 3em;
border: 1px solid #ddd;
margin: 0 auto;
font-size: 0.875rem;
}
#contact .privacy-txt .btn {
margin: 2em auto;
}
#contact .acceptance {
text-align: center;
margin: 0 auto 2em;
}
#contact .button-wrapper {
text-align: center;
margin: 0 auto 3em;
}
#contact .submit-wrapper {
text-align: center;
}
#contact .submit {
display: inline-block;
position: relative;
}
.btn-contact {
text-align: center;
margin: 0 auto;
}
.btn-contact a {
display: inline-block;
width: 100%;
max-width: 230px;
text-align: center;
padding: 0.8em 2em;
border: 1px solid #333;
} #privacy .privacy-box {
margin: 0 auto 2em;
}
#privacy .privacy-box h3 {
font-size: 1rem;
}
.aioseo-html-page-sitemap h4 {
display: none!important;
} @media(max-width: 1280px) { .contents {
max-width: 1100px;
}
}
@media(max-width: 1024px) { .contents {
max-width: 920px;
}
} @media(max-width: 820px) {
.mv {display: none;}
.mv-sp {
display: block;
padding: 6em 0 0;
}
.slick-prev, .slick-next  {display: none!important;}
.slick-dotted.slick-slider {margin-bottom: 0;} #top .main-contents h2 {font-size: 1.5rem;}
#top .top-news-contents {
margin: 0 auto 5em;
border-radius: 10px;
padding: 2em 1.5em 1.5em;
}
#top .top-news-list a {
padding: 0.8em 1.5em;
}
#top .top-product-box .product-article-item {
width: calc(100% / 2 - 1em);
margin-bottom: 2em;
}
#top .top-product-box .product-article-item .img-wrap {
text-align: center;
}
#top .top-product-box .product-article-item .img-wrap img {
width: 70%;
}
#top .top-product-box .product-article-item .txt-wrap {
text-align: center;
}
#top .top-product-box .product-article-item .txt-wrap h3 {} #product .product-item {
width: 30%;
margin-bottom: 0.5em;
}
#product .product-box {
padding-top: 1em;
}
#product .item-txt h2 {
line-height: 1.6;
}
#product .item-txt .amazon a img {width: 60%;} #news .article-list-box {
padding-top: 1em;
} #contact .contact-box table th,
#contact .contact-box table td {
display: block;
width: 100%;
}
#contact .contact-box table th {
padding-bottom: 0;
}
} @media only screen and (max-width: 479px) {
.mv-sp {padding: 5em 0 0;} #top .main-contents h2 {
font-size: 1.25rem;
}
#top .top-news-contents {
margin: 0 auto 3em;
}
#top .top-news-list a {
padding: 1.5em 1.5em 1em;
}
#top .top-news-list a p.date {
padding: 0;
line-height: 0.5;
}
#top .top-news-list a p.news-ttl {
font-size: 0.875rem;
line-height: 1.8;
}
#top .top-news-txt {
margin: 0 auto 2em;
}
#top .top-product-box .product-article-item {
width: calc(100% / 2 - 0.5em);
}
#top .top-product-box .product-article-item .img-wrap img {
width: 100%;
}
#top .top-product-box .product-article-item .txt-wrap h3 {
font-size: 0.875rem;
line-height: 1.5;
margin: 0 auto 0.5em;
} .contents-box {
padding: 0 1.5em 0;
flex-direction: column-reverse;
}
.contents-box .main-contents,
.contents-box .side {width: 100%;}
.contents-box .main-contents {
padding: 3em 0 0;
}
.contents-box .side {padding: 0 0 3em;}
#product .product-contents {margin: 0 auto 3em;}
#product .product-contents h2,
#product .category-list .category-box h2 {
font-size: 1.25rem;
}
#product .product-contents h2::before,
#product .category-list .category-box h2::before {
width: 40px;
height: 40px;
top: 14px;
padding-right: 0.3em;
}
#product .product-list {
justify-content: space-between;
gap: 1em;
margin: 0 0 3em;
}
#product .product-item {
width: 47%;
}
#product .product-box {
padding-top: 3em;
}
#product .item-main {
display: block;
}
#product .item-img,
#product .item-txt {
width: 100%;
}
#product .item-img {
text-align: center;
margin: 0 auto 1em;
}
#product .item-img img {width: 80%;}
#product .item-txt h2 {
font-size: 1.25rem;
}
#product .item-txt p.price {
margin: 0 auto;
}
#product .item-txt .amazon {
text-align: center;
}
#product .item-txt .amazon a img {
width: 60%;
}
#company h2 {
font-size: 1.25rem;
}
#company h2::before {
width: 40px;
height: 40px;
top: 14px;
padding-right: 0.3em;
}
#company .message {
padding: 1em 0 0;
margin: 0 auto 3em;
}
#company .message h2::before {
width: 40px;
height: 40px;
top: 14px;
padding-right: 0.3em;
}
#company table th, #company table td {
width: 100%;
}
#company table td {
border-top: none;
border-bottom: none;
}
#contact .contact-box {padding-top: 1em;}
#contact .contact-box h2 {
font-size: 1.25rem;
}
#contact .contact-box h2::before {
width: 40px;
height: 40px;
top: 14px;
padding-right: 0.3em;
}
}