@charset "UTF-8";

@media print, screen and (min-width:1200px) {

#kvWrap {
position: relative;
width: 100vw;
height: 100vh;
}

#kv {
position: absolute;
width: 65%;
z-index: 3;
top: 60px;
right: 60px;
}

#kv img {
width: 100%;
}

#kvWrap h1 {
position: absolute;
font-family: var(--font-oswald);
font-size: 1.8rem;
color:  var(--themeColor);
text-align: left;
z-index: 1;
left: 100px;
bottom: 100px;
}

#kvWrap h1 span {
font-family: var(--font-primary);
font-size: 3.5rem;
color:  var(--txtColor);
display: block;
line-height: 1.5;
}

#dotBg {
position: absolute;
background: url("../img/dot.webp") repeat;
background-size: 7px;
width: 80%;
height: 60vh;
z-index: 0;
top: 0;
left: 80px;
}

#wrapAboutUs {
position: relative;
width: 1200px;
margin: 0 auto;
padding: 50px 0 100px;
}

#aboutUsL {
position: absolute;
width: 606px;
left: 0;
top: 50px;
}

#aboutUsR {
width: 624px;
text-align: justify;
margin: 76px 0 0 auto;
padding: 60px 80px;
border: 1px solid var(--txtColor);
}

.commonTitle {
font-family: var(--font-oswald);
font-size: 1.6rem;
text-align: center;
color:  var(--themeColor);
margin-bottom: 30px;
line-height: 1.6;
}

.commonTitle span {
font-family: var(--font-primary);
font-size: 3rem;
display: block;
color: var(--txtColor);
}

.btn {
position: relative;
background-color: transparent;
font-family: var(--font-oswald);
width: 110px;
height: 32px;
font-size: 1.6rem;
text-align: left;
color: var(--txtColor);
cursor: pointer;
letter-spacing: .05em;
border: 0;
border-bottom: 1px solid var(--txtColor);
transition: .6s;
}

.btn::after {
position: absolute;
background-color: var(--txtColor);
width: 8px;
height: 1px;
content: "";
right: -1px;
bottom: 2px;
transform: rotate(45deg);
}

.btn:hover {
letter-spacing: .1em;
}

.wrapColor {
position: relative;
background-color: var(--themeSubColor);
width: 100%;
padding: 100px 0;
}

#wrapService {
position: relative;
width: 1200px;
margin: 0 auto;
margin-top: 45px;
display: flex;
justify-content: space-between;
z-index: 1;
}

.service {
background-color: #fff;
width: 585px;
border: 1px solid var(--txtColor);
}

.service .inner {
width: 100%;
text-align: justify;
padding: 52px;
}

.commonSubTitle {
font-size: 2.4rem;
color: var(--themeColor);
margin-bottom: 20px;
padding: 0 0 5px 15px;
line-height: 1;
border-left: 1px solid var(--themeColor);
}

#serviceBg {
position: absolute;
background: url("../img/dot.webp") repeat;
background-size: 7px;
width: 85%;
height: 580px;
z-index: 0;
right: 0;
bottom: -112px;
}

#wrapCampaignInfo {
position: relative;
background-color: var(--themeColor);
width: 1200px;
text-align: center;
color: #fff;
margin: 100px auto;
margin-top: 238px;
padding: 124px 86px;
}

#wrapCampaignInfo h2,
#wrapCampaignInfo h2 span {
color: #fff;
}

#btnFlex {
margin-top: 60px;
display: flex;
justify-content: space-between;
}

.btnW {
position: relative;
background-color: #fff;
font-family: var(--font-oswald);
width: 500px;
height: 65px;
font-size: 2.4rem;
font-weight: 500;
text-align: center;
color: var(--themeColor);
padding-bottom: 3px;
cursor: pointer;
letter-spacing: .05em;
border: 2px solid #fff;
transition: .3s;
}

.btnW:hover {
background-color: var(--themeColor);
color: #fff;
}

.btnW::before,
.btnW::after {
position: absolute;
width: 8px;
height: 8px;
margin: auto;
border-top: 2px solid var(--themeColor);
border-right: 2px solid var(--themeColor);
content: "";
transform: rotate(45deg);
top: 0;
bottom: 0;
right: 20px;
}

.btnW::after {
right: 26px;
}

.btnW:hover::before,
.btnW:hover::after {
border-top: 2px solid #fff;
border-right: 2px solid #fff;
}

.wrapIsm {
position: relative;
width: 100%;
padding: 102px 0 115px;
}

#localWrap {
position: relative;
background-color: #fff;
width: 1200px;
margin: 0 auto;
margin-top: 45px;
padding: 72px 88px;
border: 1px solid var(--txtColor);
z-index: 1;
display: flex;
justify-content: space-between;
}

.commonBgTopR {
position: absolute;
background-color: #f5f5f5;
background-size: 7px;
width: 75%;
height: 557px;
z-index: -1;
right: 0;
top: 0;
}

.commonBgBottomL {
position: absolute;
background: url("../img/dot.webp") repeat;
background-size: 7px;
width: 85%;
height: 350px;
z-index: 0;
left: 0;
bottom: 0;
}

.commonBgTopL {
position: absolute;
background-color: #f5f5f5;
background-size: 7px;
width: 75%;
height: 557px;
z-index: -1;
left: 0;
top: 0;
}

.commonBgBottomR {
position: absolute;
background: url("../img/dot.webp") repeat;
background-size: 7px;
width: 85%;
height: 350px;
z-index: 0;
right: 0;
bottom: 0;
}

#localL {
width: 495px;
}

#localR {
width: 495px;
text-align: justify
}

#wrapNews {
width: 1200px;
text-align: justify;
margin: 0 auto;
padding: 100px 0;
display: flex;
justify-content: space-between;
}

#newsL {
width: 186px;
border-right: 1px solid var(--txtColor);
}

#newsR {
position: relative;
width: 948px;
}

#newsR a {
display: block;
margin-bottom: 30px;
}

#newsR h3 {
position: relative;
}

#newsR h3::before,
#newsR h3::after {
position: absolute;
width: 8px;
height: 8px;
margin: auto;
border-top: 1px solid var(--txtColor);
border-right: 1px solid var(--txtColor);
content: "";
transform: rotate(45deg);
top: 0;
bottom: 0;
right: 0;
}

#newsR h3::after {
right: 5px;
}

.btnW::after {
right: 26px;
}

.postDate {
font-family: var(--font-oswald);
color: #959595;
display: inline-block;
}

.categoryTag {
position: relative;
width: auto;
height: 25px;
font-size: 1.5rem;
color: #959595;
text-align: center;
margin-left: 10px;
padding: 0 5px;
display: inline-block;
border: 1px solid #959595;
line-height: 22px;
top: -2px;
}

#wrapRecruit {
background-color: #2e2e2e;
width: 100%;
}

#wrapRecruit img {
width: 100%;
}

#recruitWrap {
position: relative;
background-color: #fff;
width: 1200px;
margin: 0 auto;
margin-top: -180px;
padding: 60px 80px;
z-index: 1;
}

#recruitWrap p {
text-align: justify;
}

/**/

#wrapTitle {
position: relative;
width: 1200px;
margin: 0 auto;
margin-top: 145px;
}

#wrapTitle h1 {
font-family: var(--font-oswald);
font-size: 5.5rem;
text-align: left;
color: var(--themeColor);
}

#wrapTitle h1 span {
font-family: var(--font-primary);
font-size: 2rem;
display: block;
color: var(--txtColor);
}

#breadcrumb,
#breadcrumbCo {
width: 100%;
font-size: 1.2rem !important;
text-align: left;
color: var(--txtColor);
margin-top: 55px;
margin-bottom: 110px;
padding-top: 24px;
border-top: 1px solid  var(--txtColor);
}

#breadcrumbCo {
margin-bottom: 40px;
padding: 0 0 24px;
border-top: 0;
border-bottom: 1px solid  var(--txtColor);
}

/**/

.wrapCo {
position: relative;
width: 1200px;
text-align: justify;
margin: 0 auto;
padding-bottom: 100px;
}

#companyFlex {
margin: 40px auto;
display: flex;
justify-content: space-between;
align-items: center;
}

#companyL {
width: 600px;
}

#companyR {
width: 570px;
text-align: justify;
padding: 70px 60px 70px 50px;
border-top: 1px solid  var(--txtColor);
border-right: 1px solid  var(--txtColor);
border-bottom: 1px solid  var(--txtColor);
}

#companyR p {
margin-bottom: 0;
}

#messageWrap {
position: relative;
background-color: #fff;
width: 1200px;
margin: 0 auto;
margin-top: 45px;
padding: 72px 130px;
border: 1px solid var(--txtColor);
z-index: 1;
}

#messageWrap h3 {
font-size: 2.4rem;
margin-bottom: 30px;
line-height: 1.5;
}

#messageWrap p {
text-align: justify;
margin-bottom: 0;
}

#outline {
width: 1024px;
text-align: left;
margin: 0 auto;
}

#outline dt {
float: left;
padding: 30px 0;
}

#outline dd {
padding: 30px 0 30px 158px;
border-bottom: 1px solid var(--txtColor);
}

/**/

.wrapBgCommon {
position: relative;
width: 100%;
margin-bottom: 120px;
padding: 102px 0 115px;
}

.serviceWrap {
position: relative;
background-color: #fff;
width: 1200px;
margin: 0 auto;
margin-top: 45px;
padding: 72px 80px;
border: 1px solid var(--txtColor);
z-index: 1;
}

.serviceFlex {
display: flex;
justify-content: space-between;
}

.serviceL {
width: 497px;
text-align: justify;
}

.serviceR {
width: 497px;
text-align: justify;
}

.btnFlexCe {
margin-top: 40px;
display: flex;
justify-content: center;
}

.btnService {
position: relative;
background-color: var(--txtColor);
font-family: var(--font-primary);
width: 280px;
height: 44px;
font-size: 1.6rem;
text-align: center;
color: #fff;
margin: 0 10px;
padding-bottom: 3px;
cursor: pointer;
border: 1px solid var(--txtColor);
transition: .3s;
}

.btnService:hover {
background-color: var(--themeColor);
border: 1px solid var(--themeColor);
}

.btnService::before,
.btnService::after {
position: absolute;
width: 6px;
height: 6px;
margin: auto;
border-top: 1px solid #fff;
border-right: 1px solid #fff;
content: "";
transform: rotate(45deg);
top: 0;
bottom: 0;
right: 20px;
}

.btnService::after {
right: 25px;
}

.serviceBgTopL {
position: absolute;
background-color: #f5f5f5;
background-size: 7px;
width: 75%;
height: 85%;
z-index: -1;
left: 0;
top: 0;
}

.serviceBgBottomR {
position: absolute;
background: url("../img/dot.webp") repeat;
background-size: 7px;
width: 85%;
height: 65%;
z-index: 0;
right: 0;
bottom: 0;
}

/**/

#pageNav {
width: 1200px;
margin: 0 auto;
margin-bottom: 72px;
}

#pageNav ul {
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
}

#pageNav li {
position: relative;
background-color: var(--txtColor);
width: 284px;
height: 44px;
text-align: left;
margin-bottom: 21px;
margin-right: 21px;
padding: 0 20px;
line-height: 42px;
transition: .3s;
}

#pageNav li:nth-of-type(4) {
margin-right: 0;
}

#pageNav li:hover {
background-color: var(--themeColor);
}

#pageNav li a {
height: 100%;
color: #fff;
display: block;
}

#pageNav li::before,
#pageNav li::after {
position: absolute;
width: 6px;
height: 6px;
margin: auto;
border-right: 1px solid #fff;
border-bottom: 1px solid #fff;
content: "";
transform: rotate(45deg);
top: -8px;
bottom: 0;
right: 20px;
}

#pageNav li::after {
top: 1px;
}

/**/

#wrapHouseInfo {
position: relative;
width: 1200px;
margin: 0 auto;
margin-top: 45px;
display: flex;
justify-content: space-between;
flex-wrap: wrap;
z-index: 1;
}

.houseInfo {
background-color: #fff;
width: 585px;
margin-bottom: 30px;
border: 1px solid var(--txtColor);
}

.houseInfo .inner {
width: 100%;
text-align: justify;
padding: 52px;
}

.houseInfo .inner p {
margin-bottom: 0;
}

.houseInfoBg {
position: absolute;
background: url("../img/dot.webp") repeat;
background-size: 7px;
width: 85%;
height: 580px;
z-index: 0;
left: 0;
bottom: -112px;
}

.wrapTopPa {
width: 1200px;
margin: 0 auto;
padding: 240px 0 120px;
}

.btnRedFlex {
width: 1024px;
margin: 0 auto;
margin-top: 60px;
display: flex;
justify-content: space-between;
}

.btnRed {
position: relative;
background-color: var(--themeColor);
font-family: var(--font-oswald);
width: 500px;
height: 65px;
font-size: 2.4rem;
font-weight: 500;
text-align: center;
color: #fff;
padding-bottom: 3px;
cursor: pointer;
letter-spacing: .05em;
border: 2px solid var(--themeColor);
transition: .3s;
}

.btnRed:hover {
background-color: #fff;
color: var(--themeColor);
}

.btnRed::before,
.btnRed::after {
position: absolute;
width: 8px;
height: 8px;
margin: auto;
border-top: 2px solid #fff;
border-right: 2px solid #fff;
content: "";
transform: rotate(45deg);
top: 0;
bottom: 0;
right: 20px;
}

.btnRed::after {
right: 26px;
}

.btnRed:hover::before,
.btnRed:hover::after {
border-top: 2px solid var(--themeColor);
border-right: 2px solid var(--themeColor);
}

.wrapContactJoyfit {
background-color: var(--themeColor);
width: 100%;
padding: 120px 0;
}

.wrapContactJoyfit .inner {
width: 1024px;
color: #fff;
margin: 0 auto;
display: flex;
justify-content: space-between;
}

.wrapContactJoyfit .inner h2 {
color: #fff !important;
text-align: left !important;
}

.wrapContactJoyfit .inner h2 span {
color: #fff !important;
}

.contactJoyfitL {
width: 300px;
border-right: 1px solid #fff;
}

.contactJoyfitR {
width: 724px;
text-align: left;
padding-left: 115px;
}

.contactJoyfitR .call a {
font-family: var(--font-oswald);
font-size: 5rem;
font-weight: 700;
color: #fff;
line-height: 1.3;
}

.contactJoyfitR .call img {
position: relative;
margin-right: 10px;
top: -14px;
}

.btnContactJoyfit {
position: relative;
background-color: #fff;
font-family: var(--font-oswald);
width: 490px;
height: 65px;
font-size: 2.4rem;
font-weight: 500;
text-align: center;
color: var(--themeColor);
padding-bottom: 3px;
cursor: pointer;
letter-spacing: .05em;
border: 2px solid #fff;
transition: .3s;
}

.btnContactJoyfit i {
margin-right: 5px;
}

.btnContactJoyfit:hover {
background-color: var(--themeColor);
color: #fff;
}

.btnContactJoyfit::before,
.btnContactJoyfit::after {
position: absolute;
width: 8px;
height: 8px;
margin: auto;
border-top: 2px solid var(--themeColor);
border-right: 2px solid var(--themeColor);
content: "";
transform: rotate(45deg);
top: 0;
bottom: 0;
right: 20px;
}

.btnContactJoyfit::after {
right: 26px;
}

.btnContactJoyfit:hover::before,
.btnContactJoyfit:hover::after {
border-top: 2px solid #fff;
border-right: 2px solid #fff;
}

.wrap {
width: 1200px;
margin: 0 auto;
padding: 120px 0;
}

.wrap2 {
width: 1200px;
margin: 0 auto;
padding: 0 0 120px;
}

#firstTimeUsersImg {
width: 850px;
margin: 0 auto;
}

#firstTimeUsersFlex {
width: 1024px;
margin: 0 auto;
margin-top: 60px;
display: flex;
justify-content: space-between;
}

#firstTimeUsersL {
position: relative;
width: 495px;
margin-top: 52px;
}

#firstTimeUsersL #beginner {
position: absolute;
width: 108px;
height: 108px;
z-index: 1;
left: -30px;
top: -30px;
}

#firstTimeUsersR {
width: 495px;
text-align: justify;
}

#maruttoTitle {
font-size: 2.1rem;
text-align: center;
color: var(--themeColor);
line-height: 2.5;
}

#firstTimeUsersR p {
margin-bottom: 0;
}

#nationwideJoyfitTitle {
font-size: 3.6rem;
text-align: center;
color: var(--themeColor);
line-height: 1.4;
}

#nationwideJoyfitTitle span {
font-size: 7.4rem;
font-weight: 700;
display: block;
}

#nationwideJoyfit {
font-size: 1.4rem;
margin-top: 26px;
padding-top: 28px;
border-top: 1px solid var(--txtColor);
border-bottom: 1px solid var(--txtColor);
}

#nationwideJoyfit h4 {
font-size: 2.4rem;
text-align: center;
margin-bottom: 20px;
}

#nationwideJoyfitTitle2 {
font-size: 2.2rem;
text-align: center;
color: var(--themeColor);
margin-bottom: 30px;
line-height: 1.4;
}

#nationwideJoyfitTitle2 span {
font-size: 7.4rem;
font-weight: 700;
display: block;
}

.nationwideJoyfitTitle3 {
font-size: 2.4rem;
color: var(--themeColor);
margin-bottom: 5px;
}

.nationwideJoyfitTitle3 span {
position: relative;
font-family: var(--font-oswald);
font-size: 2.6rem;
margin-right: 5px;
top: 2px;
}

.btnServiceContact {
position: relative;
background-color: var(--txtColor);
font-family: var(--font-primary);
width: 372px;
height: 44px;
font-size: 1.6rem;
text-align: center;
color: #fff;
margin: 0 10px;
padding-bottom: 3px;
cursor: pointer;
border: 1px solid var(--txtColor);
transition: .3s;
}

.btnServiceContact:hover {
background-color: var(--themeColor);
border: 1px solid var(--themeColor);
}

.btnServiceContact::before,
.btnServiceContact::after {
position: absolute;
width: 6px;
height: 6px;
margin: auto;
border-top: 1px solid #fff;
border-right: 1px solid #fff;
content: "";
transform: rotate(45deg);
top: 0;
bottom: 0;
right: 20px;
}

.btnServiceContact::after {
right: 25px;
}

#voiceFlex {
margin-top: 90px;
display: flex;
justify-content: space-between;
}

.voice {
position: relative;
width: 380px;
text-align: justify;
padding: 70px 40px 40px;
border: 1px solid var(--txtColor);
}

.voice p {
margin-bottom: 15px;
}

.voiceIcon {
position: absolute;
width: 98px;
margin: auto;
z-index: 1;
left: 0;
right: 0;
top: -49px;
}

.voiceR  {
text-align: right;
}

#priceLrFlex {
position: relative;
width: 1024px;
margin: 0 auto;
z-index: 1;
display: flex;
justify-content: space-between;
}

.priceLr {
background-color: #fff;
width: 31.5%;
font-size: 1.8rem;
color: var(--themeColor);
padding: 30px 30px;
border: 1px solid var(--txtColor);
}

.priceLr h3 {
color: var(--txtColor);
margin-bottom: 15px;
padding-bottom: 15px;
border-bottom: 1px solid var(--txtColor);
}

.priceLr span {
position: relative;
font-size: 3.4rem;
top: 2px;
}

.wrapPrice {
position: relative;
background-color: #fff;
width: 1024px;
text-align: left;
margin: 30px auto;
margin-bottom: 100px;
padding: 22px 52px;
border: 1px solid var(--txtColor);
z-index: 1;
}

.wrapPrice dl {
width: 100%;
}

.wrapPrice dt {
float: left;
font-size: 1.8rem;
padding: 30px 0;
}

.wrapPrice dd {
font-size: 1.4rem;
padding: 30px 0 30px 240px;
border-bottom: 1px solid var(--txtColor);
}

.wrapPrice dd:last-child {
border-bottom: 0;
}

.monthlyFee {
color: var(--themeColor);
margin-bottom: 5px;
line-height: 1.3;
}

.monthlyFee em {
font-size: 1.5rem;
}

.monthlyFee span  {
font-size: 2rem;
}

.wrapPriceBg {
position: absolute;
background: url("../img/dot.webp") repeat;
background-size: 7px;
width: 92%;
height: 580px;
z-index: 0;
left: 0;
bottom: -112px;
}

.wrapStoreInfo {
position: relative;
width: 1200px;
margin: 0 auto;
margin-top: 40px;
padding: 20px 0 0;
}

.storeInfoPhoto {
position: absolute;
width: 626px;
border-right: 20px solid #fff;
border-bottom: 20px solid #fff;
top: 0;
left: 0;
}

.storeInfoTxt {
width: 624px;
text-align: justify;
margin: 76px 0 0 auto;
padding: 40px 70px;
border: 1px solid var(--txtColor);
}

.storeInfoTxt dt {
float: left;
padding: 15px 0;
}

.storeInfoTxt dd {
padding: 15px 0 15px 110px;
border-bottom: 1px solid var(--txtColor);
}

.storeInfoTxt dd:last-child {
border-bottom: 0;
}

.googleMap {
position: relative;
width: 100%;
height: 0;
margin: 10px auto;
padding-top: 56.25%;
}

.googleMap iframe {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
}

/**/

.trainingWrap {
position: relative;
background-color: #fff;
width: 1200px;
margin: 0 auto;
margin-bottom: 60px;
padding: 72px 75px 32px;
border: 1px solid var(--txtColor);
z-index: 1;
}

.trainingWrap h2 {
font-size: 2.4rem;
color: var(--themeColor);
}

.trainingFlex {
margin: 40px auto;
display: flex;
justify-content: space-between;
}

.trainingL {
width: 510px;
}

.trainingR {
width: 510px;
text-align: justify;
}

.trainingWrap h3 {
font-size: 2.4rem;
text-align: left;
color: var(--themeColor);
padding: 0 0 5px 15px;
border-left: 1px solid var(--themeColor);
line-height: 1;
}

.trainingFlow {
width: 246px;
text-align: justify;
}

.trainingFlow h4 {
font-size: 1.7rem;
color: var(--themeColor);
}

.trainingFlow h4 span {
font-family: var(--font-oswald);
font-size: 1.6rem;
margin-right: 5px;
}

.flowLine {
margin: 50px auto;
border-bottom: 1px solid var(--txtColor); 
}

.trainingLrFlex {
width: 495px;
display: flex;
justify-content: space-between;
}

.trainingLrPhoto {
position: relative;
width: 49.9%;
}

.trainingLrPhoto .before {
position: absolute;
background-color: var(--txtColor); 
font-family: var(--font-oswald);
width: 56px;
height: 25px;
font-size: 1.4rem;
color: #fff;
text-align: center;
letter-spacing: .05em;
left: 0;
bottom: 0;
}

.trainingLrPhoto .after {
position: absolute;
background-color: var(--themeColor); 
font-family: var(--font-oswald);
width: 56px;
height: 25px;
font-size: 1.4rem;
color: #fff;
text-align: center;
letter-spacing: .05em;
left: 0;
bottom: 0;
}

/**/

.wrapLocal {
position: relative;
width: 1200px;
margin: 0 auto;
padding: 20px 0 100px;
}

.localPhoto,
.localPhoto2 {
position: absolute;
width: 606px;
top: 0;
}

.localPhoto {
left: 0;
}

.localPhoto2 {
right: 0;
}

.localTxt,
.localTxt2 {
width: 624px;
text-align: justify;
margin: 76px 0 0 auto;
padding: 70px;
border: 1px solid var(--txtColor);
}

.localTxt2 {
margin: 76px 0 0
}

.localTxt p,
.localTxt2 p {
margin-bottom: 0;
}

/**/

#wrapNewsCo {
width: 1020px;
text-align: justify;
margin: 0 auto;
padding: 0 0 120px;
}

#wrapNewsCo a {
display: block;
margin-bottom: 60px;
}

#wrapNewsCo h3 {
position: relative;
}

#wrapNewsCo h3::before,
#wrapNewsCo h3::after {
position: absolute;
width: 8px;
height: 8px;
margin: auto;
border-top: 1px solid var(--txtColor);
border-right: 1px solid var(--txtColor);
content: "";
transform: rotate(45deg);
top: 0;
bottom: 0;
right: 0;
}

#wrapNewsCo h3::after {
right: 5px;
}

#wrapNewsPost {
width: 1200px;
text-align: justify;
margin: 0 auto;
padding: 0 0 120px;
}

#wrapNewsPost h1 {
font-size: 3rem;
margin: 40px auto;
line-height: 1.5;
}

#wrapNewsPost img {
margin-bottom: 40px;
}

#wrapNewsPost h2 {
font-size: 2.6rem;
color: var(--themeColor);
margin: 40px auto;
padding: 0 0 3px 18px;
border-left: 1px solid var(--themeColor);
line-height: 1.4;
}

#wrapNewsPost h3 {
font-size: 2.2rem;
color: var(--themeColor);
margin: 40px auto;
padding: 0 0 3px 18px;
border-left: 1px solid var(--themeColor);
line-height: 1.4;
}

#wrapNewsPost h4 {
font-size: 1.8rem;
margin: 40px auto;
padding: 0 0 3px 18px;
border-left: 1px solid var(--themeColor);
line-height: 1.4;
}

#wrapNewsPost ol {
list-style: decimal-leading-zero;
padding-inline-start: 32px;
margin-bottom: 32px;
}

#wrapNewsPost ul {
list-style: disc;
padding-inline-start: 20px;
margin-bottom: 32px;
}

blockquote {
position: relative;
margin: 46px 0;
padding: 40px;
border: 1px solid var(--themeColor);
}

blockquote:before {
position: absolute;
font-family: 'FontAwesome';
content: '\f10d';
font-size: 1.6rem;
color: var(--themeColor);
top: 10px;
left: 20px;
}

blockquote:after {
position: absolute;
font-family: 'FontAwesome';
content: '\f10e';
font-size: 1.6rem;
color: var(--themeColor);
right: 20px;
bottom: 10px;
}

blockquote cite {
display: block;
font-size: 1.2rem;
text-align: right;
padding-right: 20px;
}

#prevNextWrap {
margin-top: 80px;
display: flex;
justify-content: center;
align-items: center;
}

.btnBackToList {
background-color: var(--txtColor);
font-family: var(--font-primary);
width: 200px;
height: 60px;
font-size: 1.4rem;
font-weight: 500;
color: #fff;
cursor: pointer;
padding-bottom: 3px;
border: 1px solid var(--pointColor);
transition: .3s;
}

.btnPrevWrap,
.btnNextWrap {
width: 30px;
margin: 0 30px;
}

.btnPrev,
.btnNext {
position: relative;
background: transparent;
font-size: 1.4rem;
text-align: left;
color: var(--txtColor);
border: none;
cursor: pointer;
}

.btnPrev {
text-align: right;
}

.btnNext:hover::before,
.btnPrev:hover::before {
background-color: #fff;
}

.btnPrev::before,
.btnPrev::after {
position: absolute;
width: 8px;
height: 8px;
content: "";
margin: auto;
border-top: 1px solid var(--txtColor);
border-left: 1px solid var(--txtColor);
transform: rotate(-45deg);
left: 17px;
top: 0;
bottom: 0;
}

.btnPrev::after {
left: 13px;
}

.btnNext::before,
.btnNext::after {
position: absolute;
width: 8px;
height: 8px;
content: "";
margin: auto;
border-top: 1px solid var(--txtColor);
border-right: 1px solid var(--txtColor);
transform: rotate(45deg);
right: 17px;
top: 0;
bottom: 0;
}

.btnNext::after {
right: 13px;
}

/**/

.wrap1024 {
width: 1024px;
text-align: justify;
margin: 0 auto;
padding-bottom: 120px;
}

.contactForm dt {
margin-top: 50px;
margin-bottom: 15px;
}

.contactForm dd {
margin-bottom: 50px;
}

.contactForm .required,
.contactForm .any {
position: relative;
background-color: #c11731;
width: 46px;
height: 25px;
font-size: 1.5rem;
text-align: center;
color: #fff;
display: inline-block;
margin-right: 10px;
line-height: 23px;
top: -.05em;
}

.contactForm .any {
background-color: var(--txtColor);
color: #fff;
}

.contactForm .input {
font-family: var(--font-primary);
width: 100%;
height: 54px;
font-size: 1.6rem;
padding: 0 15px;
border: 1px solid var(--txtColor);
}

.contactForm textarea {
font-family: var(--font-primary);
width: 100%;
height: 200px;
font-size: 1.6rem;
padding: 15px;
border: 1px solid var(--txtColor);
}

.radioWrap {
width: 100%;
margin-bottom: 20px;
}

.wpcf7-list-item {
display: block;
}

input[type="radio"] {
position: relative;
background-color: #fff;
width: 20px;
height: 20px;
margin-left: 0;
margin-right: 2px;
border: 1px solid #d0d0d0;
border-radius: 50%;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
top: .35em;
}

input[type="radio"]:checked:before {
position: absolute;
background: var(--txtColor);
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 12px;
height: 12px;
border-radius: 50%;
content: '';
}

.wpcf7-list-item-label {
padding-right: 10px;
}

.wpcf7-submitWrap p {
text-align: center;
margin-bottom: 0;
}

span.wpcf7-list-item {
margin-left: 0px;
margin-right: 10px;
}

.checkWrap input[type="checkbox"] {
margin: 0;
padding: 0;
background: none;
border-radius: 0;
outline: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
display: none;
border: none;
}

.checkWrap {
display: flex;
justify-content: center;
}

.checkWrap a {
color: var(--themeColor);
text-decoration: underline;
}

.checkWrap label {
position: relative;
display: flex;
align-items: center;
cursor: pointer;
}

.checkWrap label::before,
.checkWrap label:has(:checked)::after {
content: "";
}

.checkWrap label::before {
position: relative;
background-color: #fff;
width: 20px;
height: 20px;
margin-right: 8px;
border-radius: 3px;
border: 1px solid #d8ddd8;
top: 1px;
}

.checkWrap label:has(:checked)::before {
background-color: var(--pointColor);
}

.checkWrap label:has(:checked)::after {
position: absolute;
top: 6px;
left: 6px;
transform: rotate(45deg);
width: 8px;
height: 12px;
border: solid var(--txtColor);
border-width: 0 2px 2px 0;
}

.submitWrap {
text-align: center;
margin: 40px auto;
margin-bottom: 0;
}

.btnSubmit {
background-color: var(--txtColor);
font-family: var(--font-primary);
width: 140px;
height: 50px;
font-size: 2rem;
color: #fff;
cursor: pointer;
padding-bottom: 3px;
border: 1px solid var(--txtColor);
transition: .3s;
}

.btnSubmit:hover {
background-color: #fff;
color:var(--txtColor);
}

/**/

.privacy {
margin-top: 0px;
}

.privacy h2 {
margin-top: 60px;
margin-bottom: 20px;
padding-bottom: 15px;
border-bottom: 1px solid var(--txtColor);
}

.privacy ul {
list-style: disc;
padding-inline-start: 20px;
margin-bottom: 30px;
}

/**/

footer {
position: relative;
background-color: #2e2e2e;
width: 100%;
text-align: left;
color: #fff;
margin: 0 auto;
padding: 100px 0;
border-bottom: 5px solid var(--themeColor);
}

#footerWrap {
width: 1200px;
margin: 0 auto;
display: flex;
justify-content: space-between;
}

#footerL {
width: 460px;
font-size: 1.4rem;
}

#footerLogo {
width: 182px;
margin-bottom: 20px;
}

#telBusinessFlex #business {
font-size: 1.1rem;
line-height: 1.5;
}

.copyright {
font-family: var(--font-oswald);
margin-top: 40px;
}

#footerR {
width: 600px;
padding-left: 80px;
}

#footerR nav {
display: flex;
justify-content: space-between;
line-height: 1.5;
}

#footerR nav ul li {
position: relative;
display: table;
margin-bottom: 15px;
}

#footerR nav ul li a {
color: #fff;
}

#footerR nav ul li a:hover {
opacity: .7;
}

#footerR nav ul li ul {
margin: 10px 0;
}

#footerR nav ul li ul li {
position: relative;
margin-bottom: 10px;
padding-left: 22px;
}

#footerR nav ul li ul li::before {
position: absolute;
background-color: #fff;
width: 15px;
height: 1px;
content: "";
left: 0;
bottom: 5px;
}

#pagetop {
position: fixed;
background-color: #fff;
width: 50px;
height: 50px;
display: block;
transition: all .5s;
cursor: pointer;
border: 1px solid var(--themeColor);
z-index: 100;
right: 30px;
bottom: -60px;
}

#pagetop::before,
#pagetop::after {
position: absolute;
width: 8px;
height: 8px;
margin: auto;
border-top: 1px solid var(--themeColor);
border-right: 1px solid var(--themeColor);
content: "";
transform: rotate(-45deg);
top: 5px;
bottom: 0;
right: 0;
left: 0;
}

#pagetop::after {
top: -5px;
}

}