@charset "utf-8";
/* 共通
------------------------------------------------------------------*/
.content_low {
padding: calc(100 / var(--break) * 100vw) 0 calc(200 / var(--break) * 100vw);
}
.main_page {
height: calc(500 / var(--break) * 100vw);
padding-top: calc(80 / var(--break03));
background: #d1be99;
}
.page_main section:not(:last-child) {
margin-bottom: calc(100 / var(--break) * 100vw);
}
@media only screen and (min-width: 768px) and (max-width: 1599px) {
}
@media only screen and (min-width: 768px) and (max-width: 1299px) {
}
@media only screen and (max-width: 767px) {
.content_low {
padding: 13vw 0 25vw;
}
.content_low .inner, .main_page .inner {
max-width: calc(702 / var(--break) * 100vw);
}
.page_main section:not(:last-child) {
margin-bottom: 20vw;
}
.main_page {
background-image: url("images/page/bg_ttl_page_sp.jpg");
}
.col_img {
text-align: center;
}
}
.hdg2 .ja {
display: block;
margin-bottom: calc(10 / var(--break03));
line-height: 1.6;
letter-spacing: .1em;
font-size: calc(50 / var(--break03));
font-family: "vdl-v7mincho", sans-serif;
font-weight: 700;
font-style: normal;
text-align: center;
color: #333;
}
.hdg2 .en {
display: block;
line-height: 1;
letter-spacing: .1em;
font-size: calc(20 / var(--break03));
font-family: "cormorant-garamond", serif;
font-weight: 400;
font-style: normal;
text-align: center;
color: #ba5f00;
}
.hdg3 {
padding: calc(27 / var(--break03)) 0;
line-height: 1.5;
font-size: calc(40 / var(--break03));
font-family: "cormorant-garamond", serif;
font-weight: 400;
font-style: normal;
border-top: 2px solid #dfbd36;
border-bottom: 2px solid #f29039;
position: relative;
z-index: 1
}
@media (min-width: 768px){
.hdg2 .ja {
letter-spacing: .1em;
}
.hdg2 .en {
letter-spacing: .1em;
}
.hdg3 {
letter-spacing: .1em;
}
}
@media (min-width: 768px) and (max-width: 1599px) {
.hdg2 {
font-size: 95%;
}
}
@media (min-width: 768px) and (max-width: 1299px) {
.hdg2 {
font-size: 90%;
}
.hdg3 {
font-size: 190%;
}
}
@media (max-width: 767px) {
.hdg2 .ja {
margin-bottom: 1vw;
line-height: 1.5;
letter-spacing: 0;
font-size: calc(50 / 750 * 100vw);
}
.hdg2 .en {
letter-spacing: .1em;
font-size: calc(30 / 750 * 100vw);
}
.hdg3 {
padding: 2.9vw 0;
letter-spacing: 0;
font-size: calc(46 / 750 * 100vw)
}
.hdg3::before {
height: 1px;
}
}
/* btn_tel_common01
------------------------------------------------------------------*/
.btn_tel_common01{
max-width: 100%;
width: calc(560 / var(--break02));
height: calc(70 / var(--break02));
line-height: 1;
color: #fff;
background: #e87600;
}
.btn_tel_common01 .s01{
vertical-align: super;
padding-right: calc(20 / var(--break02));
}
.btn_tel_common01 .tel{font-size: calc(21.5 / var(--break02));}
@media(max-width: 767px) {
.btn_tel_common01{
width: calc(646 / 750 * 100vw);
height: calc(200 / 750 * 100vw);
padding-top: 2.5vw;
line-height: 1.5;
}
.btn_tel_common01 .s01{
display: block;
padding-right: 0;
line-height: 1;
font-size: calc(30.5 / 750 * 100vw);
}
.btn_tel_common01 .s02{
letter-spacing: 0;
font-size: calc(62.5 / 750 * 100vw);
}
.btn_tel_common01 .tel{font-size: calc(39.5 / 750 * 100vw);}
}
/* btn_tel_common02
------------------------------------------------------------------*/
.btn_tel_common02{
max-width: 100%;
width: calc(442 / var(--break02));
height: calc(112 / var(--break02));
padding-top: calc(10/ var(--break02));
line-height: 1.5;
color: #fff;
background: #7f4042;
}
.btn_tel_common02 .s01{
display: block;
}
.btn_tel_common02 .s01_1{
display: inline-flex;
width: calc(58 / var(--break02));
height: calc(30 / var(--break02));
margin-right: calc(10 / var(--break02));
background: #842b08;
}
.btn_tel_common02 .s02{
letter-spacing: .05em;
}
.row_contact02{
width: calc(920 / var(--break02));
}
@media(max-width: 767px) {
.btn_tel_common02{
width: calc(646 / var(--break02));
height: calc(200 / var(--break02));
padding-top: 3vw;
}
.btn_tel_common02 .s01{
font-size: calc(29.5 / var(--break02));
}
.btn_tel_common02 .s01_1{
width: calc(94 / var(--break02));
height: calc(48 / var(--break02));
margin-right: 3vw;
font-size: calc(27 / var(--break02));
}
.btn_tel_common02 .s02{
font-size: calc(62.5 / var(--break02));
letter-spacing: 0;
}
.btn_tel_common02 .s02_1{
font-size: calc(39.5 / var(--break02));
}
.row_contact02{
width: calc(646 / var(--break02));
}
}
/* btn_tel_common02 row_contact03
------------------------------------------------------------------*/
.row_contact03{
width: calc(680 / var(--break04));
}
.row_contact03 .btn_tel_common02{
max-width: 50%;
width: calc(340 / var(--break04));
height: calc(110 / var(--break04));
padding-top: calc(10/ var(--break04));
}
.row_contact03 .btn_tel_common02 .s01{
font-size: calc(16.5 / var(--break04));
}
.row_contact03 .btn_tel_common02 .s01_1{
width: calc(58 / var(--break04));
height: calc(30 / var(--break04));
margin-right: calc(10 / var(--break04));
}
.row_contact03 .btn_tel_common02 .s02{
font-size: calc(34 / var(--break04));
}
.row_contact03 .btn_tel_common02 .s02_1 {
font-size: calc(21.5 / var(--break04));
}
@media(min-width: 768px) and (max-width:1299px) {
.row_contact03{
width: calc(650 / 1700 * 100vw);
}
.row_contact03 .btn_tel_common02{
width: calc(325 / 1700 * 100vw);
height: calc(110 / 1700 * 100vw);
padding-top: calc(10/ 1700 * 100vw);
}
.row_contact03 .btn_tel_common02 .s01{
font-size: calc(15 / 1700 * 100vw);
}
.row_contact03 .btn_tel_common02 .s01_1{
width: calc(54 / 1700 * 100vw);
height: calc(26 / 1700 * 100vw);
font-size: 90%;
margin-right: calc(8 / 1700 * 100vw);
}
.row_contact03 .btn_tel_common02 .s02{
font-size: calc(34 / 1700 * 100vw);
}
.row_contact03 .btn_tel_common02 .s02_1 {
font-size: calc(21.5 / 1700 * 100vw);
}
}
@media(max-width: 767px) {
}
/* row_contact
------------------------------------------------------------------*/
.row_contact01{
max-width: 100%;
width: calc(880 / var(--break02));
}
.row_contact01 > .btn{
width: calc(278 / var(--break02));
height: calc(72 / var(--break02));
letter-spacing: .2em;
font-size: calc(21.5 / var(--break02));
color: #fff;
background: #8d5d00;
border-radius: calc(36 / var(--break02));
position: relative;
z-index: 1;
}
.row_contact01 > .btn::before{
content: "";
width: calc(31 / var(--break02));
height: calc(8.8 / var(--break02));
margin: auto;
background: url(images/page/arw01_white.svg)no-repeat center / contain;
position: absolute;
top: 0;
bottom: 0;
right: calc(24 / var(--break02));
}
.row_contact01 > .btn .icon{
width: calc(36 / var(--break02));
height: calc(36 / var(--break02));
margin: auto;
position: absolute;
top: 0;
bottom: 0;
left: calc(24 / var(--break02));
}
@media(min-width: 768px) and (max-width:1299px) {
}
@media(max-width: 767px) {
.row_contact01{
width: 100%;
}
.row_contact01 > .btn{
width: calc(340 / 750 * 100vw);
height: calc(90 / 750 * 100vw);
border-radius: calc(45 / 750 * 100vw);
letter-spacing: 0;
font-size: calc(32 / 750 * 100vw);
}
.row_contact01 > .btn::before{
width: calc(45 / 750 * 100vw);
height: calc(14 / 750 * 100vw);
right: 3vw;
}
.row_contact01 > .btn .icon{
width: calc(44 / 750 * 100vw);
height: calc(44 / 750 * 100vw);
left: 4vw;
}
.row_contact01 > .btn:last-child{
margin: calc(20 / 750 * 100vw) auto 0;
}
}
/* row_contact
------------------------------------------------------------------*/
.row_contact{
}
@media(min-width: 768px) and (max-width:1599px) {
}
@media(min-width: 768px) and (max-width:1299px) {
}
@media(max-width: 767px) {
}
/* copy_common
------------------------------------------------------------------*/
.copy_common01{
min-height: calc(105 / var(--break02));
padding: calc(15 / var(--break02));
color: #fff;
background-image: linear-gradient(to right, #ba5e00, #ae3200);
border: var(--size10px) solid #7f4042;
border-top: 0;
border-bottom: 0;
position: relative;
z-index: 1;
}
.copy_common01::before{
content: "";
width: calc(100% + 20 / var(--break02));
height: calc(100% - 18 / var(--break02));
margin: auto;
border-top: 1px solid #fff;
border-bottom: 1px solid #fff;
position: absolute;
inset: 0 calc(-10 / var(--break02));
z-index: -1;
}
@media(min-width: 768px) and (max-width:1299px) {
}
@media(max-width: 767px) {
.copy_common01{
padding: calc(10 / var(--break02));
}
.copy_common01 .fz34{
letter-spacing: 0;
font-size: calc(34 / var(--break02));
}
}
/* copy_common
------------------------------------------------------------------*/
.copy_common02{
padding: 0 0 calc(15 / var(--break02));
text-align: center;
position: relative;
z-index: 1;
}
.copy_common02::before{
content: "";
max-width: 100%;
width: calc(800 / var(--break03));
height: 1px;
margin: auto;
background: #333;
position: absolute;
inset: auto 0 0;
z-index: -1;
}
@media(min-width: 768px) and (max-width:1299px) {
}
@media(max-width: 767px) {
}
/* copy_common03
------------------------------------------------------------------*/
.copy_common03 .deco{
padding-left: calc(40 / var(--break02));
position: relative;
z-index: 1;
}
.copy_common03 .deco::before{
content: "";
width: calc(20 / var(--break02));
height: calc(20 / var(--break02));
margin: auto;
background: url(images/page/copy_common01.png)no-repeat center / contain;
position: absolute;
inset: 0 auto 0 0;
z-index: -1;
}
@media(max-width: 767px) {
.copy_common03 .deco{
padding-left: calc(50 / var(--break02));
}
.copy_common03 .deco::before{
width: calc(30 / var(--break02));
height: calc(30 / var(--break02));
}
}
/* row_common01
------------------------------------------------------------------*/
.row_common01 {
padding-bottom: calc(40 / var(--break02));
border-bottom: 1px solid #333;
position: relative;
z-index: 1;
}
.row_common01.none {
padding-bottom: 0;
border-bottom: 0;
}
@media(min-width: 768px) {
.row_common01 .col_txt{
width: 60%;
padding-right: calc(10 / var(--break02));
}
}
@media(max-width: 767px) {
.row_common01 {
max-width: calc(648 / 750 * 100vw);
margin-left: auto;
margin-right: auto;
}
}
/* row_common01
------------------------------------------------------------------*/
.row_common01 {
padding-bottom: calc(40 / var(--break02));
border-bottom: 1px solid #333;
position: relative;
z-index: 1;
}
.row_common01.none {
padding-bottom: 0;
border-bottom: 0;
}
@media(min-width: 768px) {
.row_common01 .col_txt{
width: 60%;
padding-right: calc(10 / var(--break02));
}
}
@media(max-width: 767px) {
.row_common01 {
max-width: calc(648 / 750 * 100vw);
margin-left: auto;
margin-right: auto;
}
}
/* row_common20
------------------------------------------------------------------*/
.bg_row_common02{
padding-bottom: calc(55 / var(--break03));
position: relative;
z-index: 1;
}
.bg_row_common02::before{
content: "";
width: 100%;
height: calc(400 / var(--break04));
margin: auto;
background: #f1efeb;
clip-path: polygon(0 0, 0% 100%, 100% 100%);
position: absolute;
bottom: 0;
left: 0;
right: 0;
z-index: -1;
}
.row_common02{
max-width: 1760px;
width: 96%;
}
.row_common02 > .col_img{
max-width: 1000px;
width: 57%;
position: relative;
z-index: 1;
}
.row_common02 > .col_txt{
width: 39.5%;
}
.copy_row_common02{
padding-bottom: calc(20 / var(--break03));
font-size: calc(38 / var(--break04));
border-bottom: 1px solid #7f4042;
}
@media(min-width: 768px) and (max-width:1299px) {
.copy_row_common02{
font-size: calc(38 / 1700 * 100vw);
}
}
@media (max-width: 767px) {
.bg_row_common02{
padding-bottom: calc(55 / var(--break03));
}
.bg_row_common02::before{
height: calc(160 / var(--break04));
}
.row_common02{
width: calc(100% - var(--size10px));
margin-left: auto;
margin-right: auto;
}
.row_common02 > .col_img{
margin-bottom: 1vw;
}
.copy_row_common02{
letter-spacing: 0;
margin-bottom: 2vw;
}
}
/* row_common20
------------------------------------------------------------------*/
.row_common20 > .col{
/* max-width: 600px; */
width: 48.5%;
padding-left: 4%;
padding-right: 4%;
background: #fff;
position: relative;
z-index: 1;
}
@media (max-width: 767px) {
.row_common20 > .col{
width: 100%;
margin: calc(40 / 750 * 100vw) auto 0;
padding: 8vw 5vw;
}
.row_common20 > .col:first-child
{margin-top: 0;}
}
/* row_common30
------------------------------------------------------------------*/
.row_common30>.col {
max-width: 400px;
width: 32.2%;
background: #eeebe6;
position: relative;
z-index: 1;
}
.row_common30 .areaImg{
position: relative;
z-index: 1;
}
.row_common30 .num{
width: calc(60 / var(--break03));
height: calc(75 / var(--break03));
line-height: 1;
padding-bottom: calc(15 / var(--break03));
margin: auto;
color: #fff;
font-size: calc(36 / var(--break03));
background: url(images/index/label01.png)no-repeat center / cover;
position: absolute;
top: 0;
left: 0;
z-index: 1;
}
.copy_row_common30{
padding: calc(12.5 / var(--break03));
font-size: calc(22 / var(--break03));
text-align: center;
color: #fff;
background: #7f4042;
position: relative;
z-index: 1;
}
.col:nth-of-type(2n) .copy_row_common30{
background: #ba5f00;
}
.row_common30 .areaText{
padding: calc(18 / var(--break03)) calc(26 / var(--break03)) calc(40 / var(--break03));
}
@media(min-width: 768px) {
.row_common30>.col {
margin-right: 1.7%;
}
.row_common30>.col:nth-of-type(3n),
.row_common30>.col:last-child {
margin-right: 0;
}
.row_common30>.col:nth-of-type(n + 4){
margin-top: calc(50 / var(--break03));
}
}
@media (max-width: 767px) {
.row_common30>.col {
max-width: calc(646 / var(--break02));
width: 100%;
margin: 0 auto calc(40 / 750 * 100vw);
}
.row_common30>.col:last-child {
margin-bottom: 0;
}
.row_common30 .num{
width: calc(72 / var(--break03));
height: calc(90 / var(--break03));
padding-bottom: 2vw;
font-size: calc(43.5 / var(--break03));
}
.copy_row_common30{
padding: 1.9vw;
letter-spacing: .1em;
font-size: calc(36 / var(--break03));
}
.row_common30 .areaText{
padding: calc(18 / var(--break03)) calc(26 / var(--break03)) calc(40 / var(--break03));
}
}
/* row_common31
------------------------------------------------------------------*/
.row_common31{
max-width: 1300px;
margin-left: auto;
margin-right: auto;
}
.row_common31>.col {
width: 32.35%;
min-height: var(--size120px);
padding: calc(20 / var(--break02));
line-height: 1.6;
color: #fff;
background-image: linear-gradient(to right, #644509, #0c0801);
border: 1px solid #fff;
position: relative;
z-index: 1;
}
.row_common31>.col::before,
.row_common31>.col::after
{
content: "";
width: var(--size40px);
height: var(--size40px);
margin: auto;
border: 1px solid #fff;
position: absolute;
}
.row_common31>.col::before{
border-bottom: 0;
border-right: 0;
top: calc(10 / var(--break02));
left: calc(10 / var(--break02));
}
.row_common31>.col::after{
border-top: 0;
border-left: 0;
bottom: calc(10 / var(--break02));
right: calc(10 / var(--break02));
}
.row_common31>.col:nth-of-type(2n){
background-image: linear-gradient(to left, #ae3100, #ba5f00);
}
@media(min-width: 768px) {
.row_common31>.col {
margin-right: 1.4%;
}
.row_common31>.col:nth-of-type(3n),
.row_common31>.col:last-child {
margin-right: 0;
}
.row_common31>.col:nth-of-type(n + 4){
margin-top: calc(20 / var(--break03));
}
}
@media (max-width: 767px) {
.row_common31>.col {
width: calc(340 / 750 * 100vw);
min-height: calc(160 / 750 * 100vw);
}
.row_common31>.col:nth-of-type(n + 3) {
margin-top: calc(20 / 750 * 100vw);
}
.row_common31 .fz24{
letter-spacing: 0;
font-size: calc(24 / var(--break03));
}
.row_common30 .areaText{
padding: calc(18 / var(--break03)) calc(26 / var(--break03)) calc(40 / var(--break03));
}
}
/* box_common01
------------------------------------------------------------------*/
.box_common01{
border: 1px solid #333333;
}
.box_common02{
background: #fff;
box-shadow: 0 0 20px 0 rgba(27, 5, 9, 0.1);
position: relative;
z-index: 1;
}
.box_common02::before,
.box_common02::after
{
content: "";
width: calc(80 / var(--break02));
height: calc(80 / var(--break02));
margin: auto;
border: 1px solid #333;
position: absolute;
}
.box_common02::before{
border-bottom: 0;
border-right: 0;
top: calc(20 / var(--break02));
left: calc(20 / var(--break02));
}
.box_common02::after{
border-top: 0;
border-left: 0;
bottom: calc(20 / var(--break02));
right: calc(20 / var(--break02));
}
.box_common03{
padding: calc(50 / var(--break03));
background: #fff;
box-shadow: 0 0 20px 0 rgba(27, 5, 9, 0.1);
position: relative;
z-index: 1;
}
@media(min-width: 768px) and (max-width:1299px) {
}
@media(max-width: 767px) {
.box_common03{
padding: calc(30 / var(--break03));
}
}
/* deco_common02
------------------------------------------------------------------*/
.deco_common02{
background: url(images/page/deco02.png)no-repeat top left / calc(601 / var(--break04));
}
@media(min-width: 768px) and (max-width:1299px) {
}
@media(max-width: 767px) {
.deco_common02{
background: url(images/page/deco02.png)no-repeat top left / calc(283 / var(--break04));
}
}
/* tbl_common01
------------------------------------------------------------------*/
.tbl_common01 table {
border-color: #7f4042
}
.tbl_common01 tbody th {
vertical-align: middle;
color: #fff;
background: #7f4042;
}
.tbl_common01 tbody td {
background: #fff;
}
.tbl_common01 tr:not(:last-child) th{
border-bottom-color:#fff;
}
.tbl_common01 tr:not(:last-child) td {
border-bottom-color: #7f4042
}
.tbl_common02 table {
border-color: #333333
}
.tbl_common02 tbody th {
vertical-align: middle;
color: #333333;
background: #f9e4aa;
}
.tbl_common02 tbody td {
background: #fff;
}
.tbl_common02 tr:not(:last-child) th{
border-bottom-color:#333333;
}
.tbl_common02 tr:not(:last-child) td {
border-bottom-color: #333333
}
@media(max-width: 767px) {
}
/* banner logo
------------------------------------------------------------------*/
.banner_common{
display: block;
width: calc(600 / var(--break02));
}
.logo{
width: calc(380 / var(--break02));
}
.logo02{
width: calc(294 / var(--break03));
}
.logo03{
width: calc(400 / var(--break03));
}
.logo_common01 .wrap{
display: inline-flex;
justify-content: center;
align-items: center;
padding-left: calc(120 / var(--break03));
position: relative;
z-index: 1;
}
.logo_common01 .in-distinction{
width: calc(76 / var(--break03));
height: calc(76 / var(--break03));
color: #fff;
background: #e87600;
position: absolute;
inset: 0 auto 0 0;
}
.logo_common01 .in-logo{
padding-top: calc(15 / var(--break03));
}
@media(max-width: 767px) {
.banner_common{
width: calc(702 / var(--break02));
}
.logo{
width: calc(501 / var(--break02));
}
.logo02{
width: calc(345 / var(--break03));
}
.logo03{
width: calc(390 / var(--break03));
}
.logo_common01 .wrap{
padding-left: calc(136 / var(--break03));
}
.logo_common01 .in-distinction{
width: calc(90 / 750 * 100vw);
height: calc(90 / 750 * 100vw);
}
.logo_common01 .in-distinction .fz22{
font-size: calc(26 / 750 * 100vw);
letter-spacing: 0;
}
.logo_common01 .in-logo{
padding-top: 1vw;
}
}
/* btn_common
------------------------------------------------------------------*/
.btn_common01{
width: calc(300 / var(--break02));
height: calc(60 / var(--break02));
color: #fff;
background: #7f4042;
position: relative;
z-index: 1;
}
.btn_common01::before{
content: "";
width: calc(9 / var(--break02));
height: calc(10 / var(--break02));
margin: auto;
background: #fff;
clip-path: polygon(0 0, 0% 100%, 100% 50%);
position: absolute;
top: 0;
bottom: 0;
right: calc(25 / var(--break02));
z-index: -1;
}
@media(min-width: 768px) and (max-width:1299px) {
}
@media(max-width: 767px) {
.btn_common01{
width: calc(500 / var(--break02));
height: calc(100 / var(--break02));
}
.btn_common01::before{
width: calc(11 / var(--break02));
height: calc(12 / var(--break02));
right: calc(25 / var(--break02));
}
}
/* parts-conversion
------------------------------------------------------------------*/
.bg_conversion{
padding: 0 0 calc(50 / var(--break02));
position: relative;
z-index: 1;
}
.bg_conversion::before{
content: "";
width: 100%;
height: calc(100% - 40 / var(--break02));
margin: auto;
background: url(images/page/bg_conversion01.png)no-repeat center / cover;
position: absolute;
bottom: 0;
left: 0;
right: 0;
z-index: -1;
}
.bg_conversion02{
padding: calc(40 / var(--break02)) 0;
background: url(images/page/bg_conversion02.png)no-repeat center / cover;
}
.copy_conversion_en{
line-height: .8;
letter-spacing: .15em;
font-size: calc(140 / var(--break03));
color: #d1be99;
text-align: center;
position: relative;
z-index: 1;
}
.copy_conversion_jp{
text-align: center;
font-size: calc(40 / var(--break03));
color: #fff;
}
@media(min-width: 768px) and (max-width:1299px) {
}
@media(max-width: 767px) {
.bg_conversion::before{
background: url(images/page/bg_conversion01_sp.png)no-repeat center / cover;
}
.bg_conversion02{
padding: calc(50 / var(--break02)) 0;
background: url(images/page/bg_conversion02_sp.png)no-repeat center / cover;
}
.copy_conversion_en{
letter-spacing: 0;
}
.copy_conversion_jp{
font-size: calc(40 / var(--break03));
}
}
/*
------------------------------------------------------------------*/
@media(min-width: 768px) and (max-width:1299px) {
}
@media(max-width: 767px) {
}
/* リスク・副作用
------------------------------------------------------------------*/
.box_risk01 .box {
overflow: hidden;
max-height: 180px;
height: auto;
touch-action: auto !important;
position: relative;
background: #eee;
padding-right: calc(50 / var(--break) * 100vw);
}
.box_invisalign {
max-width: 1000px;
border: ;
}
.box_invisalign .box {
overflow: hidden;
max-height: 180px;
height: auto;
touch-action: auto !important;
position: relative;
padding-right: calc(50 / var(--break) * 100vw);
}
/* パーフェクトスクロールバー */
.risk .ps__thumb-y, .box_invisalign .ps__thumb-y {
background: #333333 !important;
right: 0px !important;
width: 4px !important;
}
.risk .ps--active-x > .ps__rail-x,
.risk .ps--active-y > .ps__rail-y, .box_invisalign .ps--active-x > .ps__rail-x,
.box_invisalign .ps--active-y > .ps__rail-y {
background: none !important;
right: 0px !important;
width: 4px !important;
opacity: 1!important;
}
.risk .ps .ps__rail-x.ps--clicking, .risk .ps .ps__rail-x:focus, .risk .ps .ps__rail-x:hover, .risk .ps .ps__rail-y.ps--clicking, .risk .ps .ps__rail-y:focus, .risk .ps .ps__rail-y:hover, .box_invisalign .ps .ps__rail-x.ps--clicking, .box_invisalign .ps .ps__rail-x:focus, .box_invisalign .ps .ps__rail-x:hover, .box_invisalign .ps .ps__rail-y.ps--clicking, .box_invisalign .ps .ps__rail-y:focus, .box_invisalign .ps .ps__rail-y:hoverr {
opacity: 1!important;
}
@media(min-width: 768px) and (max-width:1599px) {
}
@media(min-width: 751px) and (max-width:1299px) {
}
@media(max-width: 767px) {
.box_risk01 .box {
padding-right: 4vw;
max-height: calc(420 / var(--break) * 100vw);
}
.box_risk01 .ttl, .box_invisalign .ttl {
font-size: 1.125rem;
letter-spacing: 0;
}
.box_risk01 .txt {
letter-spacing: 0;
}
.sp.risk .ps-container > .ps-scrollbar-y-rail > .ps-scrollbar-y, .sp.risk .ps-container > .ps-scrollbar-y-rail, .box_invisalign .ps-container > .ps-scrollbar-y-rail > .ps-scrollbar-y, .box_invisalign .ps-container > .ps-scrollbar-y-rail {
right: 0!important;
width: 2px!important;
}
}
/* 採用情報 recruit
------------------------------------------------------------------*/
.tbl_guideline01:not(:last-child) {
margin-bottom: calc(100 / var(--break) * 100vw);
}
.tbl_form01 th {
color: #333333;
}
.tbl_form01 td input,
.tbl_form01 td textarea {
background-color: #fff;
border-radius: calc(5 / var(--break02));
}
.tbl_form01 .require span:after {
color: #fff;
background-color: #7f4042;
}
.btn_submit input {
border: none;
background: #7f4042;
}
@media(min-width: 768px) and (max-width:1299px) {
}
@media(max-width: 767px) {
.tbl_guideline01 td a {
text-decoration: underline;
color: var(--guideline-color);
}
.tbl_form01 .require span{
display: inline;
position: relative;
z-index: 1;
}
.tbl_form01 .require span:after {
width: calc(100 / var(--break) * 100vw);
height: calc(60 / var(--break) * 100vw);
line-height: calc(60 / var(--break) * 100vw);
left: calc(100% + var(--size15px));
right: auto;
}
}
/* お問い合わせ contact
------------------------------------------------------------------*/
.grecaptcha-badge { visibility: hidden; }
@media(min-width: 768px) and (max-width:1599px) {
}
@media(min-width: 768px) and (max-width:1299px) {
}
@media(max-width: 767px) {
}
/* ブログ blog
------------------------------------------------------------------*/
#sidebar {
width: 24%;
}
#sidebar h4 {
background: #959595;
color: #fff;
font-weight: 500;
font-size: 1.25rem;
line-height: calc(40 / var(--break) * 100vw);
margin-bottom: calc(4 / var(--break) * 100vw);
text-align: center;
}
#sidebar caption {
margin-bottom: calc(5 / var(--break) * 100vw);
}
#wp-calendar {
width: 100%;
margin-bottom: calc(10 / var(--break) * 100vw);
}
#wp-calendar thead th {
background: #eee;
border: 1px solid #eee;
border-right-color: #eee;
font-size: .8125rem;
font-weight: normal;
}
#wp-calendar tbody td {
border: 1px solid #eee;
text-align: center;
font-size: .875rem;
line-height: 1.8;
}
#wp-calendar tbody td a {
color: #959595;
text-decoration: underline;
}
.wp-calendar-nav{
display:-webkit-box;
display:-ms-flexbox;
display: -webkit-flex;
display:flex;
-webkit-box-pack:justify;
-ms-flex-pack:justify;
-webkit-justify-content:space-between;
justify-content:space-between;
-webkit-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-align-items: flex-start;
align-items: flex-start;
margin-bottom: calc(60 / var(--break) * 100vw);
line-height: 1.5;
}
.wp-calendar-nav-prev{padding-left: calc(10 / var(--break) * 100vw);}
.wp-calendar-nav-next{padding-right: calc(10 / var(--break) * 100vw);}
.wp-calendar-nav a{
padding-bottom: calc(3 / var(--break) * 100vw);
border-bottom: 1px solid #333;
display:-webkit-box;/*--- Androidブラウザ用 ---*/
display:-ms-flexbox;/*--- IE10 ---*/
display: -webkit-flex;/*--- safari（PC）用 ---*/
display:flex;
-webkit-box-pack:justify;/*--- Androidブラウザ用 ---*/
-ms-flex-pack:justify;/*--- IE10 ---*/
-webkit-justify-content:space-between;/*--- safari（PC）用 ---*/
justify-content:space-between;
-webkit-flex-wrap: wrap; /* Safari */
flex-wrap: wrap;
}
#sidebar ul li {
width: 100%;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
#sidebar ul li a {
border-bottom: 1px solid #333;
padding-bottom: calc(4 / var(--break) * 100vw);
line-height: 2.1;
}
.post_main {
width: 71%;
}
.navigation {
display:-webkit-box;/*--- Androidブラウザ用 ---*/
display:-ms-flexbox;/*--- IE10 ---*/
display: -webkit-flex;/*--- safari（PC）用 ---*/
display:flex;
-webkit-box-pack:justify;/*--- Androidブラウザ用 ---*/
-ms-flex-pack:justify;/*--- IE10 ---*/
-webkit-justify-content:space-between;/*--- safari（PC）用 ---*/
justify-content:space-between;
margin-bottom: calc(60 / var(--break) * 100vw);
}
.navigation li {
width: calc(170 / var(--break) * 100vw);
}
.navigation .navitop {
text-align: center;
}
.navigation .naviright {
text-align: right;
}
.navigation li a {
padding-bottom: calc(4 / var(--break) * 100vw);
border-bottom: 1px solid #333;
}
.post_content img {
max-width: 100%;
height: auto;
}
.date_single {
display: block;
text-align: right;
font-size: .8125rem;
margin-top: calc(-30 / var(--break) * 100vw);
margin-bottom: calc(40 / var(--break) * 100vw);
}
.post_content {
line-height: 1.75;
}
.thmb {
width: calc(120 / var(--break) * 100vw);
}
.thmb img {
height: calc(120 / var(--break) * 100vw);
object-fit: cover;
}
.thmb a:hover .img_thmb {
opacity: .75;
}
.txt_post {
width: calc(100% - calc(140 / var(--break) * 100vw));
}
.page_main section.blog_archive {
padding-bottom: calc(35 / var(--break) * 100vw);
border-bottom: 1px solid #959595;
}
.post_main section.blog_archive:not(:last-child) {
margin-bottom: calc(40 / var(--break) * 100vw);
}
.txt_post a {
color: inherit;
}
.txt_post a:hover {
text-decoration: underline;
}
.txt_post h4 {
width: 100%;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
line-height: 1.7;
font-size: 1.25rem;
letter-spacing: .1em;
}
.blog_archive .txt_post .date {
color: #959595;
}
.txt_post .txt_excerpt {
line-height: 1.75;
margin-top: calc(8 / var(--break) * 100vw);
}
.txt_post .txt_excerpt .more {
color: #aaa;
text-decoration: underline;
}
.page_main .wp-pagenavi {
margin-top: calc(60 / var(--break) * 100vw);
text-align: center;
font-size: .875rem;
}
.page_main .wp-pagenavi a, .page_main .wp-pagenavi span {
text-decoration: none;
border: 1px solid #959595;
color: #959595;
padding: 0 calc(10 / var(--break) * 100vw);
margin: calc(2 / var(--break) * 100vw);
display: inline-block;
}
.page_main .wp-pagenavi span.pages {
padding: 0 calc(11 / var(--break) * 100vw);
}
.page_main .wp-pagenavi a:hover, .page_main .wp-pagenavi span.current {
border-color: #959595;
background: #959595;
color: #fff;
}
.page_main .wp-pagenavi span.current {
font-weight: normal;
}
.post_content li {
list-style: inherit;
margin-left: 1.5em;
}
.post_content > h4,.post_content > h5{
line-height: 1.6;
font-size: 1.25rem;
letter-spacing: 0.1em;
margin-bottom: calc(35 / var(--break) * 100vw );
}
#sidebar .category h4{
margin-bottom: calc(20 / var(--break) * 100vw );
}
#sidebar .category ul{
gap:calc(10 / var(--break) * 100vw ) 3%;
}
#sidebar .category ul li{
font-size: 1rem;
width: auto;
overflow: visible;
white-space:normal;
}
#sidebar .category ul li a{
border: 1px solid #959595;
background: #959595;
color: #fff;
padding: calc(4 / var(--break) * 100vw ) calc(8 / var(--break) * 100vw );
line-height: 1.6;
}
#sidebar .category ul li a.is-active{
background: #fff;
color: #959595;
}
@media(min-width: 768px) and (max-width:1599px) {
}
@media(min-width: 768px) and (max-width:1299px) {
}
@media(max-width: 767px) {
.page_main {
display: block!important;
}
#sidebar {
width: 100%;
}
#sidebar h4 {
line-height: calc(80 / var(--break) * 100vw);
}
.post_main {
width: 100%;
margin-bottom: 20vw;
}
.thmb {
width: calc(210 / var(--break) * 100vw);
}
.thmb img {
height: calc(210 / var(--break) * 100vw);
}
.txt_post {
width: calc(100% - calc(240 / var(--break) * 100vw));
}
.txt_post h4 {
font-size: 1rem;
letter-spacing: 0;
}
.navigation li {
width: calc(200 / 750 * 100vw);
}
.page_main .wp-pagenavi span.pages,.page_main .wp-pagenavi a, .page_main .wp-pagenavi span {
padding: .5vw 2vw;
margin: calc(4 / 750 * 100vw);
}
.page_main section.blog_archive {
padding-bottom: 6vw;
}
.post_main section.blog_archive:not(:last-child) {
margin-bottom: 6vw;
}
.post_main .wp-pagenavi {
margin-top: 12vw;
display:-webkit-box;/*--- Androidブラウザ用 ---*/
display:-ms-flexbox;/*--- IE10 ---*/
display: -webkit-flex;/*--- safari（PC）用 ---*/
display:flex;
-webkit-box-pack:justify;/*--- Androidブラウザ用 ---*/
-ms-flex-pack:justify;/*--- IE10 ---*/
-webkit-justify-content: center;
-ms-justify-content: center;
justify-content: center;
-webkit-flex-wrap: wrap; /* Safari */
flex-wrap: wrap;
}
.single_post > h3 {
letter-spacing: 0;
font-size: 1.1875rem;
}
.post_content > h4,.post_content > h5{
letter-spacing: 0;
font-size: 1.125rem;
}
#sidebar .category ul li a{
border-radius: calc(8 / var(--break)* 100vw);
padding: calc(4 / var(--break)* 100vw) calc(14 / var(--break)* 100vw);
}
}
/* フォーマット format
------------------------------------------------------------------*/
.format {
padding-bottom: calc(140 / var(--break) * 100vw);
}
.wrap_format01:not(:last-of-type) {
margin-bottom: calc(100 / var(--break) * 100vw);
}
.img_format01 {
max-width: 1000px;
}
.row_format01 .col_img {
width: 46%;
max-width: 570px;
}
.row_format01 .col_txt {
width: 50%;
}
.list_format01 li {
max-width: 425px;
}
.row_format03 .col_img {
width: 29%;
max-width: 350px;
}
.row_format03 .col_txt {
width: 67%;
}
.row_format03 .copy {
border-bottom: 1px solid #333;
}
.row_format03 .copy:before {
content: "";
position: absolute;
width: calc(20 / var(--break) * 100vw);
height: calc(20 / var(--break) * 100vw);
left: 0;
top: .4em;
background: #333;
}
.txt_format01 {
max-width: 1000px;
}
.tbl_fee {
max-width: 1000px;
}
.tbl_fee table {
border-color: #;
}
.tbl_fee th {
background: #;
}
.tbl_fee thead th {
background: #;
text-align: center;
}
.tbl_fee thead tr th:not(:last-of-type) {
border-right: 1px solid #fff;
}
.tbl_fee tr:not(:last-child) td {
border-bottom-color: #;
}
.tbl_fee tbody tr td:not(:last-of-type) {
border-right: 1px solid #;
}
.tbl_fee01 tbody th {
text-align: center;
}
.wrap_format01 .box_flow:last-of-type:before {
display: none;
}
.box_format03 .col_img {
width: 31%;
max-width: 345px;
}
.box_format03 .col_txt {
width: 65%;
}
.row_format04 .col {
width: 31.8%;
max-width: 394px;
margin-right: 2.3%;
}
.row_format04 .col:nth-child(3n), .row_format04 .col:last-child {
margin-right: 0;
}
.row_format04 .col:not(:nth-child(-n+3)) {
margin-top: calc(60 / var(--break) * 100vw);
}
.wrap_format01 .box_qa03 {
border: none;
margin-bottom: calc(60 / var(--break) * 100vw);
}
.wrap_format01 .box_qa03 .box_a .box {
width: calc(60 / var(--break) * 100vw);
height: calc(60 / var(--break) * 100vw);
left: 0;
top: 0;
}
.wrap_format01 .box_qa03 .box_a {
padding-top: calc(30 / var(--break) * 100vw);
padding-left: calc(100 / var(--break) * 100vw);
}
.box_format04 .ttl {
font-weight: 300;
height: calc(50 / var(--break) * 100vw);
}
.list_format02 li:not(:first-child) {
margin-top: calc(14 / var(--break) * 100vw);
}
.list_format02 .year {
width: calc(140 / var(--break) * 100vw);
}
.list_format02 .txt {
width: calc(100% - calc(140 / var(--break) * 100vw));
}
.risk_format {
border: 1px solid #333;
}
.risk_format .box{
overflow-y: scroll;
max-height: 280px;
scrollbar-color: #333 #fff;
scrollbar-width: thin;
}
@media(min-width: 768px) and (max-width:1599px) {
}
@media(min-width: 768px) and (max-width:1299px) {
}
@media(max-width: 767px) {
.format {
padding-bottom: 17vw;
}
.wrap_format01:not(:last-of-type) {
margin-bottom: 20vw;
}
.img_format01 {
max-width: 100%;
}
.box_format01 .ttl {
font-size: 1.125rem;
letter-spacing: 0;
}
.list_format01 li {
max-width: 100%;
}
.row_format03 .copy {
font-size: 1.125rem;
letter-spacing: 0;
}
.row_format03 .copy:before {
top: .55em;
}
.txt_format01 {
max-width: calc(646 / var(--break) * 100vw);
}
.tbl_fee {
max-width: 100%;
}
.tbl_fee01 tbody th {
text-align: left;
}
.box_format03 {
display: block;
}
.box_format03 .copy {
font-size: 1.125rem;
}
.row_format04 {
display: block;
}
.row_format04 .col {
width: 100%;
max-width: calc(600 / var(--break) * 100vw);
margin: 0 auto!important;
}
.row_format04 .col:not(:first-child) {
margin-top: calc(60 / var(--break) * 100vw);!important;
}
.row_format04 .ttl {
font-size: 1.125rem;
letter-spacing: 0;
}
.wrap_format01 .box_qa03 .box_a .box {
width: calc(80 / var(--break) * 100vw);
height: calc(80 / var(--break) * 100vw);
font-size: 1.5625rem;
}
.tbl_format01.js-scrollable table {
width: calc(1200 / var(--break) * 100vw);
font-size: .875rem;
}
.img_format02 {
max-width: calc(500 / var(--break) * 100vw);
}
.name_format .job {
font-size: .875rem;
letter-spacing: 0;
}
.name_format .ja {
font-size: 1.25rem;
letter-spacing: 0;
}
.box_format04 .ttl {
font-size: 1.125rem;
letter-spacing: 0;
height: calc(80 / var(--break) * 100vw);
}
.list_format02 li:not(:first-child) {
margin-top: 2vw;
}
.list_format02 .year {
width: calc(200 / var(--break) * 100vw);
}
.list_format02 .txt {
width: calc(100% - calc(200 / var(--break) * 100vw));
}
}