분류:
편집 요약 없음 |
편집 요약 없음 |
||
| (사용자 3명의 중간 판 55개는 보이지 않습니다) | |||
| 1번째 줄: | 1번째 줄: | ||
@import url('https://fonts.googleapis.com/css2?family=Black+Han+Sans&family=Gugi&family=Noto+Sans+KR:wght@100;400&family=Noto+Serif+KR:wght@200;500&family=Sunflower:wght@300;500&display=swap'); | |||
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200;400;700&display=swap'); | |||
.info { | |||
width: 100%; | |||
text-align: center; | |||
} | |||
img { | |||
object-fit: contain; | |||
max-height: 100%; | |||
} | |||
.pct-infobox { | |||
width: 360px; | |||
float: right; | |||
clear: right; | |||
padding: 0.2em; | |||
} | |||
@media (max-width: 768px){ | |||
.pct-infobox { | |||
width: 100%; | |||
max-width: 450px; | |||
margin: 0 auto; | |||
} | |||
} | |||
@media (max-width: 540px){ | |||
.pct-infobox { | |||
width: 100%; | |||
max-width: 100%; | |||
clear: both; | |||
} | |||
} | |||
.pct-fixedbox { | |||
width:100%; | |||
border-collapse:collapse; | |||
margin-top: 12px; | |||
} | |||
.fixedbox-title { | |||
height:60px; | |||
color:white; | |||
font-size:24px; | |||
text-align:center; | |||
vertical-align:middle; | |||
border-bottom:1px solid#bbb; | |||
} | |||
.fixedbox-row-full { | |||
color:white; | |||
border-bottom:1px solid#bbb; | |||
text-align: center; | |||
padding:6px 6px; | |||
font-size:14px; | |||
vertical-align:middle; | |||
} | |||
.fixedbox-row-20 { | |||
width: 20%; | |||
color:white; | |||
border-top:1px solid#bbb; | |||
text-align: center; | |||
padding:6px 6px; | |||
font-size:14px; | |||
vertical-align:middle; | |||
} | |||
.fixedbox-row-20:last-child { | |||
border: 0px; | |||
} | |||
.fixedbox-row-30 { | |||
width: 30%; | |||
background-color:#eeeeee; | |||
border-top:1px solid#bbb; | |||
text-align: center; | |||
padding:8px 6px; | |||
font-size:14px; | |||
vertical-align:middle; | |||
} | |||
.fixedbox-row-30:last-child { | |||
border-bottom: 0px; | |||
} | |||
.fixedbox-row-40 { | |||
width: 40%; | |||
background-color:#fff; | |||
border-top:1px solid#bbb; | |||
text-align: center; | |||
padding:8px 6px; | |||
font-size:14px; | |||
vertical-align:middle; | |||
} | |||
.fixedbox-row-40:last-child { | |||
border: 0px; | |||
} | |||
.fixedbox-row-desc { | |||
border-top:1px solid#bbb; | |||
padding:6px 8px; | |||
font-size:14px; | |||
font-weight:500; | |||
vertical-align:middle; | |||
} | |||
.fixedbox-row-desc:last-child { | |||
border-bottom:0px; | |||
} | |||
.pct-infobox-title { | |||
height:auto; | |||
color:white; | |||
font-size:24px; | |||
font-weight:500; | |||
text-align:center; | |||
vertical-align:middle; | |||
background:#000; | |||
} | |||
.pct-infobox-image { | |||
vertical-align:middle; | |||
text-align:center; | |||
} | |||
.pct-infobox-row-full { | |||
color:white; | |||
height:32px; | |||
text-align:center; | |||
vertical-align:middle; | |||
font-size:13px; | |||
} | |||
.togglebutton { | |||
cursor:pointer; | |||
display:block; | |||
text-align:center; | |||
} | |||
#togglebutton, #togglecontent { | |||
height:0; | |||
overflow:hidden; | |||
} | |||
#togglebutton:checked + #togglecontent { | |||
height:auto; | |||
position:relative; | |||
} | |||
2022년 4월 26일 (화) 13:53 기준 최신판
@import url('https://fonts.googleapis.com/css2?family=Black+Han+Sans&family=Gugi&family=Noto+Sans+KR:wght@100;400&family=Noto+Serif+KR:wght@200;500&family=Sunflower:wght@300;500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200;400;700&display=swap');
.info {
width: 100%;
text-align: center;
}
img {
object-fit: contain;
max-height: 100%;
}
.pct-infobox {
width: 360px;
float: right;
clear: right;
padding: 0.2em;
}
@media (max-width: 768px){
.pct-infobox {
width: 100%;
max-width: 450px;
margin: 0 auto;
}
}
@media (max-width: 540px){
.pct-infobox {
width: 100%;
max-width: 100%;
clear: both;
}
}
.pct-fixedbox {
width:100%;
border-collapse:collapse;
margin-top: 12px;
}
.fixedbox-title {
height:60px;
color:white;
font-size:24px;
text-align:center;
vertical-align:middle;
border-bottom:1px solid#bbb;
}
.fixedbox-row-full {
color:white;
border-bottom:1px solid#bbb;
text-align: center;
padding:6px 6px;
font-size:14px;
vertical-align:middle;
}
.fixedbox-row-20 {
width: 20%;
color:white;
border-top:1px solid#bbb;
text-align: center;
padding:6px 6px;
font-size:14px;
vertical-align:middle;
}
.fixedbox-row-20:last-child {
border: 0px;
}
.fixedbox-row-30 {
width: 30%;
background-color:#eeeeee;
border-top:1px solid#bbb;
text-align: center;
padding:8px 6px;
font-size:14px;
vertical-align:middle;
}
.fixedbox-row-30:last-child {
border-bottom: 0px;
}
.fixedbox-row-40 {
width: 40%;
background-color:#fff;
border-top:1px solid#bbb;
text-align: center;
padding:8px 6px;
font-size:14px;
vertical-align:middle;
}
.fixedbox-row-40:last-child {
border: 0px;
}
.fixedbox-row-desc {
border-top:1px solid#bbb;
padding:6px 8px;
font-size:14px;
font-weight:500;
vertical-align:middle;
}
.fixedbox-row-desc:last-child {
border-bottom:0px;
}
.pct-infobox-title {
height:auto;
color:white;
font-size:24px;
font-weight:500;
text-align:center;
vertical-align:middle;
background:#000;
}
.pct-infobox-image {
vertical-align:middle;
text-align:center;
}
.pct-infobox-row-full {
color:white;
height:32px;
text-align:center;
vertical-align:middle;
font-size:13px;
}
.togglebutton {
cursor:pointer;
display:block;
text-align:center;
}
#togglebutton, #togglecontent {
height:0;
overflow:hidden;
}
#togglebutton:checked + #togglecontent {
height:auto;
position:relative;
}