@charset "utf-8";
/*
Theme Name: theme-rideon
Description: theme-rideon
Version: 1.0
Author: gainz
*/

* {
 margin: 0;
 padding: 0;
 line-height: 1;
 box-sizing: border-box;
}
html, body {
 min-height: 100%;
}
body {
 height: 100%;
 font-family: 'Noto Serif JP', serif;
 font-size: 16px;
}
a { text-decoration: none; }
a:hover,
a:hover img,
.entry-header a:hover h2 {
 opacity: 0.6;
 -moz-opacity: 0.6;
 -webkit-opacity: 0.6;
 filter:alpha(opacity=60);
}
a[href^="tel:"] { cursor: default; }
.text_deco_ul {
 text-decoration: underline;
}
img {
 border: none;
 max-width: 100%;
 height: auto;
 width: auto;
 vertical-align: bottom;
}
.clearfix:after {
 content: '';
 display: block;
 clear: both;
 height: 0;
}
.disp_n {
 display: none;
}
.disp_i {
 display: inline;
}
.disp_ib {
 display: inline-block;
}
.disp_b {
 display: block;
}
.text_l {
 text-align: left;
}
.text_c {
 text-align: center;
}
.text_r {
 text-align: right;
}
.float_l {
 float: left;
}
.float_r {
 float: right;
}
.ovf_h {
 overflow: hidden;
}
.pos_a {
 position: absolute;
}
.pos_r {
 position: relative;
}
.pos_f {
 position: fixed;
}
.v_top {
 vertical-align: top;
}
.v_mid {
 vertical-align: middle;
}
.v_btm {
 vertical-align: bottom;
}
.fs_0 {
 font-size: 0;
}
.fs_20 {
 font-size: 20px;
}
.font_b {
 font-weight: bold;
}
.line_hi {
 line-height: inherit;
}
.line_h1 {
 line-height: 1.75;
}
.mg-lra {
 margin-left: auto;
 margin-right: auto;
}
.mw1000 {
 max-width: 1000px;
}
#container {
 max-width: 1920px;
 margin: 0 auto;
 overflow: hidden;
 position: relative;
}
#to_top {
 position: fixed;
 width: 38px;
 bottom: 20px;
 right: 20px;
 cursor: pointer;
 z-index: 10000;
 visibility: hidden;
}

#top-head {
 position: fixed;
 width: 100%;
 height: 120px;
 z-index: 100;
 top: 0;
 left: 0;
 padding: 0 10px;
}
#top-head .mask {
  display: block;
  position: absolute;
  top: 0px;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #fff;
  opacity: 0.8;
  filter: alpha(opacity=80);
}
#top-head .inner {
 max-width: 1170px;
 margin: 0 auto;
 padding-top: 27px;
}
/* Toggle Button */
#nav-toggle {
 position: absolute;
 top: 11px;
 right: 10px;
 width: 40px;
 height: 40px;
 text-align: center;
 cursor: pointer;
 z-index: 104;
 padding: 3px 4px;
 display: none;
 border-radius: 5px;
 overflow: hidden;
}
#nav-toggle:before {
 content: '';
 display: block;
 position: absolute;
 top: 0px;
 left: 0;
 width: 100%;
 height: 100%;
 background-color: #afd0b6;
}
#nav-toggle div {
 position: relative;
 margin-top: 6px;
}
#nav-toggle div.mtxt {
 margin-top: 35px;
 font-size: 12px;
 color: #fff;
}
#nav-toggle span {
 display: block;
 position: absolute;
 height: 2px;
 width: 100%;
 background: #fff;
 left: 0;
 -webkit-transition: .35s ease-in-out;
 -moz-transition: .35s ease-in-out;
 transition: .35s ease-in-out;
}
#nav-toggle span:nth-child(1) {
 top: 0;
}
#nav-toggle span:nth-child(2) {
 top: 10px;
}
#nav-toggle span:nth-child(3) {
 top: 20px;
}
.open #nav-toggle span:nth-child(1) {
 top: 11px;
 -webkit-transform: rotate(315deg);
 -moz-transform: rotate(315deg);
 transform: rotate(315deg);
}
.open #nav-toggle span:nth-child(2) {
 width: 0;
 left: 50%;
}
.open #nav-toggle span:nth-child(3) {
 top: 11px;
 -webkit-transform: rotate(-315deg);
 -moz-transform: rotate(-315deg);
 transform: rotate(-315deg);
}
#global-nav .logo {
 width: 250px;
 display: block;
 float: left;
}
#global-nav .top-contact {
 width: 203px;
 display: block;
 float: right;
 margin-top: 12px;
}
#global-nav ul {
 list-style: none;
 float: right;
 margin-top: 22px;
}
#global-nav ul li {
 float: left;
 padding: 0 10px;
}
#global-nav ul li a,
#footer ul li a {
 color: #42210b;
 font-size: 20px;
}
.bg-1 {
 background-image: url(images/bg-1.png);
 background-position: center top;
}
.bgc-1 {
 background-color: #dfefe4;
}
.bgc-2 {
 background-color: #deeee3;
}
.bgc-3 {
 background-color: #d6dcf0;
}
.bgc-4 {
 background-color: #d3edf9;
}

#footer > div:first-child {
 padding: 40px 10px 60px;
 max-width: 740px;
}
#footer .logo {
 width: 250px;
}
#footer ul {
 list-style: none;
 margin-top: 40px;
}
#footer ul li {
 float: left;
 padding: 0 15px;
}
#footer .addr {
 margin-top: 40px;
 text-align: center;
 line-height: 1.75;
}
#footer .copyright {
 background-color: #afd0b6;
 padding: 15px 10px;
 text-align: center;
}
#footer .copyright img {
 width: 426px;
 vertical-align: middle;
}
#topimg > div,
.top-1 > div {
 max-width: 1280px;
}
#topimg .imgwrapper,
.top-1 .imgwrapper {
 width: 150%;
 margin-left: -25%;
}
#topimg .top-title {
 position: absolute;
 width: 100%;
 top: 55%;
 text-align: center;
}
.box-1 {
 max-width: 1560px;
 width: 100%;
 position:relative;
}
.box-1.float_l {
 padding-right: 15px;
}
.box-1.float_r {
 padding-left: 15px;
}
.box-1 .ovf_h {
 height: 100%;
 width: 48.07%;
 position: absolute;
}
.box-1 .ovf_h img {
 position: absolute;
 top: 0;
 bottom: 0;
 left: 0;
 margin: auto;
 min-width: 500px;
}
.box-1.float_r .ovf_h {
 right: 0;
}
.box-1 .content {
 width: 51.93%;
 max-width: 810px;
 padding-top: 60px;
 padding-bottom: 60px;
}
.box-1 .content.float_r {
 padding-left: 90px;
}
.box-1 .content.float_l {
 padding-right: 90px;
}
.title-1 {
 color: #42210b;
 font-size: 30px;
 font-weight: normal;
 margin-bottom: 60px;
}
.title-1 .jp {
 font-size: 16px;
}
.btn-1 {
 max-width: 320px;
 background-color: #afd0b6;
 text-align: center;
 margin: 40px auto 0;
 display: block;
 padding: 10px;
}
.dbox {
 padding: 100px 15px;
}
.dbox-2 {
 padding: 60px 15px;
}
/* top */
.top-main-text {
 position: absolute;
 z-index: 2;
}
.top-text-1 {
 width: 34.43%!important;
 max-width: 663px!important;
 min-width: 300px!important;
 left: 50%!important;
 margin-left: -5.5%!important;
 bottom: 30%!important;
}
.top-text-2 {
 width: 33.03%!important;
 max-width: 634px!important;
 min-width: 280px!important;
 right: 50%!important;
 margin-right: -6%!important;
 bottom: 30%!important;
}
.top-1 .text {
 position: absolute;
 width: 100%;
 padding: 0 15px;
 top: 15%;
 left: 0;
 font-size: 28px;
 color: #fff;
 line-height: 2;
 text-align: center;
 z-index: 2;
}
.top-1 .text .mark {
 width: 88px;
 margin: 0 auto 40px;
}
.top-2 {
 margin-left: 110px;
 margin-bottom: 40px;
}
.top-f-1 {
 width: 181px;
 top: 0;
 left: -88px;
}
.top-f-2 {
 width: 152px;
 top: -70px;
 left: 50%;
 margin-left: 80px;
}
.top-f-3 {
 width: 94px;
 top: 0;
 left: 2px;
}
.top-3 {
 max-width: 1170px;
 margin-top: 80px;
}
.dbox.top {
 padding-top: 140px;
 padding-bottom: 120px;
}
.top-3 > div {
 margin-left: -15px;
 margin-right: -15px;
}
.top-3 > div > div {
 display: inline-block;
 width: 240px;
 padding-left: 15px;
 padding-right: 15px;
 padding-bottom: 40px;
 vertical-align: top;
}
.top-3 .top-title {
 font-size: 16px;
 font-weight: normal;
 color: #1a1a1a;
 height: 45px;
 margin-bottom: 10px;
 text-align: center;
 line-height: 1.4;
}
.top-3 .cosmename {
 font-size: 18px;
 color: #42210b;
 height: 50px;
 text-align: center;
 line-height: 1.4;
}
.top-3 .cosme {
 background-color: #fff;
 border-radius: 10px;
 line-height: 210px;
 width: 210px;
 height: 210px;
 margin-bottom: 10px;
}
.top-insta {
 background-color: #dfefe4;
 border-radius: 20px;
 padding: 60px 15px 40px;
 font-size: 20px;
 line-height: 1.8;
 margin-top: 80px;
}

/* page */
.page-bg-1 {
 background: url(images/page-bg-1.png) center top repeat-y;
}
.page-bg-4 {
 background: url(images/page-bg-4.png) center top repeat-y;
}
.health-f-1 {
 width: 83px;
 left: 50%;
 top: -30px;
 margin-left: -170px;
}
.health-food-1 {
 max-width: 530px;
 padding-right: 10px;
 margin-top: 50px;
}
#efforts .box-1 .ovf_h,
#efforts .box-1 .ovf_h img {
 position: relative;
}
@media screen and (min-width: 768px) {
#efforts .box-1 .content {
 padding-bottom: 0;
}
}
.efforts-t-1,
.efforts-t-2,
.efforts-t-3 {
 margin-left: 80px;
}
.efforts-f-1 {
 width: 61px;
 top: 30px;
}
.efforts-f-2 {
 width: 52px;
 top: 30px;
}
.efforts-f-3 {
 width: 65px;
 top: 30px;
}
.text-1 {
 font-size: 20px;
}
.about-f-1 {
 width: 94px;
 top: -20px;
 left: 50%;
 margin-left: -220px;
}
.about-2 {
 background-color: #dfefe4;
 border-radius: 10px;
 padding: 40px 20px 60px;
 max-width: 630px;
}
.about-tbl {
 width: 100%;
 max-width: 445px;
 border-collapse: collapse;
}
.about-tbl tr {
 border-bottom: solid 1px #9fb5a6;
}
.about-tbl th {
 width: 100px;
 color: #42210b;
 text-align: left;
 font-weight: normal;
 padding: 20px 0;
 line-height: 1.4;
}
.about-tbl td {
 padding: 20px 0;
 line-height: 1.4;
}
.cosmetics-2 {
 max-width: 830px;
 padding: 0 15px;
}
.cosmetics-2 > div {
 padding: 80px 0 60px;
 border-top: dotted 2px #7fbeee;
}
.cosmetics-2 > div:first-child {
 border-top: none;
}
.cosmetics-2 .left {
 padding-right: 340px;
 min-height: 320px;
}
.cosmetics-2 .right {
 padding-left: 340px;
 min-height: 320px;
}
.cosmetics-2 .w {
 max-width: 450px;
 width: 100%;
}
.cosmetics-f-1 {
 width: 65px;
 left: 0;
 top: -10px;
}
.cosmetics-2 .title-1 {
 margin-left: 80px;
}
.cosmetics-2 .img {
 position:absolute;
 top: 0;
 max-width: 320px;
 margin: 0 auto 30px;
}
.cosmetics-2 .left .img {
 right: 0;
}
.cosmetics-2 .right .img {
 left: 0;
}
.cosmetics-2 p {
 font-size: 20px;
 line-height: 1.75;
}
.contact-1 {
 margin-top: 100px;
}
.contact-2 {
 background-color: #dfefe4;
 padding: 40px 20px;
 border-radius: 10px;
}
.col_g {
 color: #006837;
}
.contact-f-1 {
 width: 94px;
 top: -20px;
 left: 50%;
 margin-left: -180px;
}
#formtbl {
 width: 100%;
 max-width: 800px;
 margin: 15px auto;
 border-collapse: collapse;
 font-size: 16px;
 border-top: solid 1px #d1cac5;
}
#formtbl tr {
 border-bottom: solid 1px #d1cac5;
}
#formtbl th {
 color: #42210b;
 width: 230px;
 padding: 25px 10px;
 padding-left: 20px;
 vertical-align: top;
 text-align: left;
 line-height: 1.4;
 font-weight: normal;
}
#formtbl td {
 padding: 20px 20px 20px 10px;
 vertical-align: top;
}
#formtbl td.radio {
 padding-top: 25px;
}
#formtbl td.radio .wpcf7-list-item {
 margin-bottom: 10px;
}
#formtbl input[type='text'],
#formtbl input[type='tel'],
#formtbl input[type='email'],
#formtbl textarea {
 width: 99%;
 padding: 10px;
 font-size: 16px;
}
.wpcf7-submit {
 width: 280px;
 margin: 20px auto 0;
 display: block;
 background-color: #b0d1b7;
 color: #42210b;
 font-size: 16px;
 padding: 12px 10px;
 border: none;
}
.wpcf7c-conf {
background-color: #ddd!important;
}
span.wpcf7-not-valid-tip {
 margin-top: 10px;
 margin-bottom: 10px;
}
.acceptance {
 text-align: center;
 margin: 40px auto 0;
}

@media screen and (max-width: 1559px){
#efforts .box-1 {
}
}
@media screen and (max-width: 1219px){
.top-3 {
max-width: 690px;
}
}
@media screen and (max-width: 1023px){
.pc1023_n {
 display: none;
}
.sp1023_i {
 display: inline;
}
body.open {
 overflow: hidden;
}
#top-head {
 height: 64px;
 padding: 0;
}
#top-head.open {
 height: 100%;
}
#top-head .inner {
 padding: 6px 10px;
}
#top-head.open .inner {
 height: 100%;
 background-color: rgba(255,255,255,0.4);
}
#top-head.open #global-nav .spmask {
 position: absolute;
 top: 0px;
 left: 0px;
 width: 100%;
 height: 64px;
 z-index: 102;
 background-color: rgba(255,255,255,1);
}
#top-head .logo {
 width: 125px;
 margin-top: 10px;
 z-index: 103;
}
#global-nav .top-contact {
 width: 40px;
 margin-top: 6px;
 margin-right: 60px;
 z-index: 103;
}
#global-nav ul {
 position: absolute;
 width: 100%;
 max-height: 100%;
 overflow: auto;
 float: none;
 clear: both;
 font-size: 0;
 top: -800px;
 margin-top: -52px;
 padding-top: 52px;
 left: 0;
 -webkit-transition: .5s ease-in-out;
 -moz-transition: .5s ease-in-out;
 transition: .5s ease-in-out;
 z-index: 101;
}
#global-nav ul li {
 float: none;
 background-color: #dfefe4;
 min-height: 60px;
 border-top: solid 1px #afd0b6;
}
#global-nav ul li a {
 padding: 20px;
 padding-left: 30px;
 padding-right: 35px;
 height: 60px;
 display: block;
 position: relative;
 color: #000;
}
#global-nav ul li a:after {
 content: '>';
 display: block;
 position: absolute;
 height: 10px;
 top: 50%;
 right: 20px;
 margin-top: -10px;
}
.open #global-nav ul {
  /* #global-nav top + #mobile-head height */
  -moz-transform: translateY(864px);
  -webkit-transform: translateY(864px);
  transform: translateY(864px);
}
#nav-toggle {
 display: block;
}
#footer ul {
 display: none;
}
.box-1 .content.float_r {
 padding-left: 40px;
}
.box-1 .content.float_l {
 padding-right: 40px;
}
.box-1 .ovf_h img {
 left: 50%;
 margin-left: -250px;
}
.top-1 .text {
 font-size: 20px;
 top: 10%;
}
.top-1 .text .mark {
 width: 77px;
 margin-bottom: 30px;
}
.top-f-1 {
 width: 110px;
 left: 0;
}
}
@media screen and (max-width: 767px){
.sp767_tl {
 text-align: left;
}
.sp767_i {
 display: inline;
}
.top-1 .text {
 top: 5%;
 font-size: 18px;
}
.top-1 .text .mark {
 width: 66px;
 margin-bottom: 20px;
}
.box-1 {
 float: none;
 padding: 0 !important;
}
.box-1 .ovf_h {
 position: relative;
 height: 300px;
 width: auto;
 float: none;
 max-width: 735px;
 margin-left: auto;
 margin-right: auto;
}
.box-1.float_l .ovf_h {
/* float: left;*/
}
.box-1.float_r .ovf_h {
 float: right;
}
.box-1 .ovf_h img {
 left: 0;
 margin-left: auto;
}
.box-1 .ovf_h.top-4-img img {
 top: -50%;
 bottom: auto;
}
.box-1 .content {
 float: none;
 width: auto;
 max-width: 840px;
 padding-left: 15px!important;
 padding-right: 15px !important;
}
.text-1 {
 font-size: 18px;
}
.cosmetics-2 p {
 font-size: 18px;
}
}

@media screen and (max-width: 634px){
.pc634_n {
 display: none;
}
.sp634_i {
 display: inline;
}
#footer .logo {
/* width: 125px; */
}
#footer .copyright {
 padding: 10px;
}
#footer .copyright img {
 width: 213px;
}
.top-1 .text {
 position: static;
 margin-top: 40px;
 margin-bottom: 40px;
 color: #000;
 text-align: left;
}
.top-1 .text .title {
 font-size: 20px;
 font-weight: bold;
 margin: 10px 0;
}
}
@media screen and (max-width: 420px){
.pc420_n {
 display: none;
}
.sp420_i {
 display: inline;
}
.sp420_tbl,
.sp420_tbl tr,
.sp420_tbl thead,
.sp420_tbl tbody,
.sp420_tbl th,
.sp420_tbl td {
 display: block;
 width: auto !important;
}
.dbox {
 padding-top: 60px;
 padding-bottom: 60px;
}
.title-1 {
 font-size: 26px;
}
#topimg {
 margin-top: 64px;
}
#topimg .top-title {
 top: 40%;
}
#topimg .top-title img {
 height: 22px;
}
.box-1 .ovf_h {
 width: 100%;
 height: 240px;
}
.top-text-1 {
 margin-left: -140px!important;
 bottom: 15%!important;
}
.top-text-2 {
 margin-right: -125px!important;
 top: 35%!important;
 bottom: auto%!important;
}
.top-f-2 {
 width: 120px;
 margin-left: 55px;
}
.top-3 .cosmename {
 height: auto;
}
.text-1 {
 text-align: left;
}
.about-1 .title {
 font-size: 20px;
 font-weight: bold;
 margin: 10px 0;
}
.about-f-1 {
 top: -30px;
 margin-left: -190px;
}
.about-2 {
 padding-top: 20px;
 padding-bottom: 40px;
}
.contact-1{
 margin-top: 60px;
}
.contact-f-1 {
 top: -20px;
 margin-left: -165px;
}
#formtbl th {
 padding-bottom: 0;
 padding-left: 5px;
}
#formtbl td.radio .wpcf7-list-item {
 line-height: 2;
}
.cosmetics-2 > div {
 padding: 60px 0 40px;
}
.cosmetics-2 .left {
 padding-right: 0px;
 min-height: 0;
}
.cosmetics-2 .right {
 padding-left: 0px;
 min-height: 0px;
}
.cosmetics-2 > div > div > div {
 float: none;
}
.cosmetics-2 .img {
 position:static;
}
}