@charset "utf-8";
h1 {
font-size: clamp(1.25rem, 0.889rem + 1.48vw, 2rem);
    margin-bottom: 24px;
}
.commonHead {
    text-align: center;
    margin-bottom: 2rem;
    font-size: clamp(1.875rem, 1.42rem + 2.27vw, 3.125rem);
    line-height: 1.2;
}.commonHead span:first-child {
font-weight: bold;
font-size: clamp(1.75rem, 1.389rem + 1.48vw, 2.5rem);
}
.commonHead span:last-child {
font-size: clamp(0.875rem, 0.757rem + 0.59vw, 1.125rem);
display: block;
}
dd {
font-size: 1rem;
}
time {
    display: flex;
    justify-content: flex-end;
    font-weight: bold;
    font-size: clamp(0.75rem, 0.69rem + 0.25vw, 0.875rem);
    margin-top: auto;
}
.archive {
display: flex;
justify-content: space-between;
}
.archive .breadCrumb {
max-width: 816px;
width: 100%;
padding: 20px 0 60px;
}
.archiveColumn,.archiveClinic {
max-width: 816px;
padding-bottom: 100px;
}
.archiveColumnWrap > ul,.archiveSingleWrap > ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 30px;
    margin: 60px 0 50px;	
}
.archiveColumnWrap > ul > li,.archiveSingleWrap > ul > li {
margin-bottom: 40px;
}
.archiveColumnWrap > ul > li > a,.archiveSingleWrap > ul > li > a {
    display: flex;
    font-weight: bold;
    flex-direction: column;
    position: relative;
    height: 100%;
    background: #fff;
    border-radius: 4px;
}
.archiveColumnWrap > ul > li img,.archiveSingleWrap > ul > li img {
    width: 100%;
    aspect-ratio: 46 / 25;
    object-fit: cover;
    border-radius: 4px 4px 0 0;
}

.catWrap {
    display: flex;
    align-items: center;
}
.archiveColumnWrap .tagWrap {
display: flex;
flex-wrap: wrap;
}
.archiveColumnWrap .tagWrap li {
margin: 16px 0 0;
font-size: 12px;
margin-right: 8px;
}
.archiveColumnWrap .tagWrap li a {
background-color: #fff;
position: relative;
display: block;
padding: 0.3rem 1rem;
border-radius: 50px;
border: 2px solid #fff;
}
.tagWrap ul li a:hover {
border: 2px solid #FD5F00;
background: #fd5f0014;
}
.archiveColumnWrap > ul > li > a > div,.archiveSingleWrap > ul > li > a > div {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    padding: 24px;
}
.archiveColumnWrap > ul a > div > *:nth-child(2),.archiveSingleWrap > ul a > div > *:nth-child(2) {
    padding: 16px 0 24px;
}
.archiveColumnWrap .columnTitle,.archiveSingleWrap .columnTitle {
font-size: clamp(1rem, 0.88rem + 0.49vw, 1.25rem);
}
.archiveColumnWrap > ul > li .columnTag {
    font-weight: bold;
    display: flex;
    flex-wrap: wrap;
    padding: 0;
}
.archiveColumnWrap > ul > li .columnTag li:not(:last-child) {
    margin-right: 8px;
}
.columnTag {
    padding: 0;
}
.archiveColumnWrap time {
display: flex;
justify-content: right;
padding-top: 16px;
}
.articleSec > ul {
display: flex;
flex-wrap: wrap;
width: 100%;
justify-content: space-between;
}
.articleSec > ul > li {
width: 48%;
display: flex;
}
.articleSec > ul > li a {
display: block;
width: 100%;
background: #fff;
border-radius: 10px;
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.16);
margin-bottom: 2.5rem;
}
.articleSec > ul > li a:hover {
-webkit-animation: buttonHover 0.3s forwards;
animation: buttonHover 0.3s forwards
}
.catParts {
    border-radius: 4px;
    padding: 5px 20px;
    margin-right: 8px;
        color: #fff;
    font-size: clamp(0.625rem, 0.444rem + 0.74vw, 1rem);
}
.mainCarList {
border-radius: 4px;
    padding: 5px 20px;
    margin-right: 8px;
    background: #F6F5F2;

    font-size: clamp(0.625rem, 0.444rem + 0.74vw, 1rem);
}
.articleSec > p {
font-size: 1.2rem;
}
.articleSec dl  {
padding: 16px;
}
.articleSec dl dt  {
border-bottom: 3px solid #d8a8aa;
padding-bottom: 1rem;
margin-bottom: 1rem;
}
.articleSec dl dd  {
font-size: 0.8rem;
}
.tagParts {
padding: 0 16px 16px;
}
.tagParts ul {
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
}
.tagParts ul li {
font-size: 0.8rem;
border-radius: 20px;
margin-left: 0.5rem;
font-weight: bold;
color: #d8a8aa;
}
.select {
width: 225px;
height: 40px;
cursor: pointer;
background-color: white;
box-shadow: 0 2px 0 white;
border-radius: 2px;
}

.select_expand {
width: 0;
height: 40px;
position: absolute;
top: 0;
right: 0;
}

.select_expand::after {
content: '\003E';
position: absolute;
top: 50%;
right: 0;
transform: translate(-50%, -50%) rotate(90deg) scaleY(1.75);
color: #3e3e3e;
font-size: 28px;
pointer-events: none;
z-index: 2;
transition: all 250ms cubic-bezier(.4, .25, .3, 1);
opacity: .6;
}

.select_expand:hover::after {
opacity: 1;
}

.select_expand:checked::after {
transform: translate(-50%, -50%) rotate(90deg) scaleX(-1) scaleY(1.75);
}

.select_expandLabel {
display: block;
width: 100%;
height: 40px;
position: absolute;
top: 0;
left: 0;
cursor: pointer;
}

.select_close {
display: none;
}

.select_closeLabel {
width: 100vw;
height: 100vh;
position: fixed;
top: 0;
left: 0;
display: none;
}

.select_items {
width: 100%;
position: absolute;
top: 0;
left: 0;
border: 2px solid #2fb5d1;
border-radius: 2px;
padding-top: 40px;
}

.select_input {
display: none;
}

.select_label {
transition: all 250ms cubic-bezier(.4, .25, .3, 1);
display: block;
height: 0;
font-size: 1.2rem;
line-height: 40px;
overflow: hidden;
color: #3e3e3e;
background-color: #fff;
cursor: pointer;
padding-left: 20px;
}

.select_label-placeholder {
height: 40px;
vertical-align: middle;
position: absolute;
top: 0;
left: 0;
opacity: .6;
background-color: transparent;
}

.select_expand:checked + .select_closeLabel {
display: block;
}

.select_expand:checked + .select_closeLabel + .select_options .select_label {
height: 40px;
}

.select_options .select_label:hover {
background-color: #f7f7f7;
}

.select_expand:checked + .select_closeLabel + .select_options + .select_expandLabel {
display: none;
}

.select_input:checked + .select_label {
height: 40px;
margin-top: -40px;
}
.select_expand:checked + .select_closeLabel + .select_options .select_label {
height: 40px;
}

.select_options .select_label:hover {
background-color: #f7f7f7;
}

.select_expand:checked + .select_closeLabel + .select_options + .select_expandLabel {
display: none;
}

.select_input:checked + .select_label {
height: 40px;
margin-top: -40px;
}
.columnSec > ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.columnSec > ul li {
width: calc( 50% - 27.5px );
}
.columnSec ul li a img {
width: 100%;
aspect-ratio: 5 / 3;
object-fit: cover;
}
.columnSec ul li a > div {
display: flex;
flex-wrap: wrap;
padding-left: 2.5rem;
width: 73%;
}
.columnSec ul li a > div dl {
width: 100%;
}
.columnSec ul li a > div dt {
margin-bottom: 1rem;
}
.columnSec ul li time {
display: flex;
justify-content: flex-end;
align-items: end;
margin-left: auto;
}
.newsArticleSec > ul li {
display: grid;
    grid-template-columns: auto auto;
    align-items: center;
    grid-gap: 60px;
}
.newsArticleSec > ul li > div {
display: flex;
align-items: center;
}
.newsArticleSec > ul li > div:first-child {
font-size: 14px;
font-weight: 700;
display: flex;
}
.newsArticleSec > ul li > div:first-child > div {
background: #005792;
border-radius: 10px;
color: #fff;
min-width: 110px;
height: 30px;
display: flex;
align-items: center;
justify-content: center;
}
.newsArticleSec > ul li a:hover {
opacity: 0.6;
}

@media screen and (max-width: 768px) {
    .breadCrumb.mW {
        padding-top: 16px;
    }
.archiveColumn, .archiveClinic {
margin-bottom: 64px;
}
.archive .breadCrumb {
padding: 24px 0 16px;
}
        main {
        padding-top: 16px;
    }
dt {
font-size: clamp(1.125rem, 0.886rem + 1.02vw, 1.375rem);
}
dd {
font-size: clamp(1rem, 0.881rem + 0.51vw, 1.125rem);
}.archiveColumnWrap > ul, .archiveSingleWrap > ul {
    grid-gap: 16px;
    margin: 24px 0 40px;
}
.archiveColumnWrap > ul > li,.archiveSingleWrap > ul > li {
margin-bottom: 8px;
}
.archiveColumnWrap > ul > li > a > div,.archiveSingleWrap > ul > li > a > div {
padding: 16px 12px;
}
.archiveColumnWrap > ul a > div > *:nth-child(2), .archiveSingleWrap > ul a > div > *:nth-child(2) {
    padding: 8px 0;
}
.archiveColumnWrap dl dt {
padding-top: 8px;
}
.catParts,.mainCarList {
        padding: 2px 8px;
    }

.SearchContents {
background: #fff;
padding: 0;
}
.selectBox {
display: flex;
justify-content: center;
font-weight: bold;
}
.selectWrap {
position: relative;
margin-right: 1rem;
}
.selectBox select {
appearance: none;
min-width: 150px;
padding: 1rem 2rem;
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.16);
border-radius: 10px;
background-color: #fff;
color: #333333;
font-size: 1em;
cursor: pointer;
}
option {
border: solid 2px red;
}
.selectBox button {
background: #005792;
padding: 1rem 1.5rem;
color: #fff;
border-radius: 30px;
display: flex;
align-items: center;
cursor: pointer;
}
.selectBox button span:first-child {
padding-right: 0.8rem;
}
.selectBox button span img {
width: 15px;
height: auto;
}
.tagWrap {
padding: 2rem 0;
border-radius: 10px;
background: #F2F3F7;
}
.tagWrap ul li a {
padding: 0.5rem 1rem;
font-size: clamp(0.625rem, 0.148rem + 2.04vw, 1.125rem);
}
.articleSec > ul > li {
width: 100%;
}

.archiveColumnWrap time {
padding-top: 8px;
}
.articleSec dl dt {
font-size: clamp(1rem, 0.404rem + 2.54vw, 1.625rem);
}
.tagParts ul li {
font-size: clamp(0.75rem, 0.392rem + 1.53vw, 1.125rem);
}
.popularSec ul {
display: block;
}
.popularSec ul li {
margin-bottom: 2rem;
}
.columnSec ul li {
margin-bottom: 2rem;
}
.columnSec ul li a {
flex-wrap: wrap;
border-top: none;
padding: 0;
}
.columnSec ul li a figure {
width: 100%;
}	
.columnSec ul li a > div {
width: 100%;
padding-left: 0;
}
.columnSec dl {
margin-bottom: 2.5rem;
}
.columnSec dt {
margin: 1rem 0 0.5rem;
}

.newsArticleSec {
margin-bottom: 2rem;
}
.newsArticleSec > ul {
max-width: 100%;
}
.newsArticleSec > ul li {
align-items: flex-start;
flex-direction: column;
}
.newsArticleSec > ul li a {
margin: 20px 0 0 0;
font-size: 14px;
}
.newsArticleSec > ul li > div:first-child {
width: 100%;
flex-direction: row-reverse;
justify-content: space-between;
}
.newsArticleSec > ul li > div:first-child > div {
height: 24px;
}
.newsArticleSec  ul li time {
justify-content: flex-start;
}
}