@charset "utf-8";

.c1 {color:var(--color-primary) !important;}

.c-w {color:#fff !important;}

.font1 {font-family:var(--font-primary) !important;}

.fz16 {font-size:16px !important;}
.fz24 {font-size:24px !important;}
.fz26 {font-size:26px !important;}
.fz72 {font-size:72px !important;}

.mt30 {margin-top:30px !important;}

.mb20 {margin-bottom:20px !important;}
.mb28 {margin-bottom:28px !important;}
.mb50 {margin-bottom:50px !important;}
.mb55 {margin-bottom:55px !important;}
.mb60 {margin-bottom:60px !important;}
.mb85 {margin-bottom:85px !important;}
.mb90 {margin-bottom:90px !important;}
.mb100 {margin-bottom:100px !important;}
.mb180 {margin-bottom:180px !important;}
.mb200 {margin-bottom:200px !important;}

.mr20 {margin-right:20px !important;}
.mr60 {margin-right:60px !important;}

.caution-txt {color:#e4752c !important;}

.doc-cnt:not(:last-child) {margin-bottom:135px;}
.doc-cnt2:not(:last-child) {margin-bottom:180px;}
.doc-cnt3:not(:last-child) {margin-bottom:100px;}

.doc-img {margin-bottom:40px; text-align:center;}

.doc-tit {margin-bottom:38px; color:#333; text-align:center; font-family:var(--font-primary); font-size:36px; font-weight:400; letter-spacing:-.03em; line-height:1.67em;}

.doc-txt {color:#555; text-align:center; font-family:var(--font-secondary); font-size:20px; font-weight:500; letter-spacing:-.03em; line-height:1.85em;}
.doc-txt2 {font-family:var(--font-primary); font-size:20px; font-weight:400; line-height:1.3em; color:#333;}
.doc-txt3 {font-family:var(--font-secondary); font-size:18px; font-weight:400; line-height:1.3em; color:#242424;}

.doc-box {border-radius:15px; border:3px solid #333; background:#fff;}

.visit-btns ul {display:flex; align-items:center; justify-content:center; margin:0 -20px;}
.visit-btns ul li {padding:0 20px;}

.doc-btn {display:inline-block;overflow:visible;position:relative; border:1px solid #ddd;text-align:center;text-decoration:none !important;vertical-align:top;white-space:nowrap;cursor:pointer;color:#333; min-width:360px; padding:0 15px; font-family:var(--font-primary); font-size:22px; font-weight:400; letter-spacing:-.03em; line-height:1.3em; border-radius:35px; border:2px solid #111; display:inline-flex; justify-content:center; align-items:center; height:70px;}
.doc-btn.dog {position:relative;}
.doc-btn.dog:before {position: absolute; left:50%; z-index: 1; top:-45px; margin-left:-30px; content:""; width:60px; height:50px; background:url("../images/sub/dog.png") no-repeat 50% 50% / contain;}
.doc-btn.st1 {background:var(--color-primary); color:#fff;}
.doc-btn.st2 {background:#cfedff;}
.doc-btn.ty2 {min-width:285px;}
.doc-btn.ty3 {min-width:230px;}
.btn-pack.doc-btn2 {margin-left:10px; min-width:160px;  background:#fff; display:inline-flex; align-items:center; justify-content:center; font-size: 17px; font-weight: 700;; letter-spacing:-.03em; height:50px; border:2px solid #111; border-radius:6px;}

.dog-acc {position:relative;}
.dog-acc:before {content:""; width:60px; height:55px; background:url("../images/sub/dog2.png") no-repeat 50% 50% / contain; position: absolute; left:30px; top:-49px;}

.young-img {margin-bottom:38px; text-align:center;}

.txt-mg .doc-txt:not(:last-child) {margin-bottom:32px;}

.partner-box {border-radius:30px; padding:53px 40px; ;max-width:1000px; margin:43px auto 0; display:flex; background:#fffaf8;}
.partner-box .doc-tit {margin-right:45px;}
.partner-box p {text-align:left; font-family:var(--font-secondary); font-size:18px; font-weight:500; letter-spacing:-.03em; line-height:2em; flex:1 1 auto; min-width:0; width:1%;}

.write-order {padding:0 63px;}
.write-order ol {display:flex;}
.write-order ol li {text-align:center; width:33.333%; position:relative;}
.write-order ol li:after {position: absolute; top:30%; right:0; margin-right:-13px; content:""; width:27px; height:33px; background:url("../images/sub/arr.png") no-repeat 50% 50% / contain;}
.write-order ol li:last-child:after {display:none;}
.write-order .doc-txt2.c-w {margin:20px 0;}

.badge {border-radius:25px; background:var(--color-primary); padding:0 35px; height:50px;  display:inline-flex; justify-content:center; align-items:center; text-align:center;}

.guide-box {margin-bottom:40px; padding:42px 60px 53px;text-align:left;}
.guide-box:last-child {margin-bottom:0;}
.guide-box .doc-tit {margin-bottom:30px; text-align:left;}
.guide-box strong {color:#242424;}

.square-list>li {color:#333; font-family:var(--font-secondary); font-size:20px; font-weight:500; letter-spacing:-.03em; margin-bottom:12px; position:relative; padding-left:18px; line-height:1.4em; font-family:var(--font-secondary);}
.square-list>li:before {position:absolute; top:7px; margin-left:-18px; line-height:1.4em; content:"■"; font-family:var(--font-secondary); font-weight:500; font-size:10px;}
.square-list>li:last-child {margin-bottom:0;}

.hypen-list {margin-top:14px;}
.hypen-list>li {padding-left:.6em; text-indent:-.6em; margin-bottom:8px; font-size:16px; font-weight:400; color:#333; font-family:var(--font-secondary); line-height:1.4em;}
.hypen-list>li:last-child {margin-bottom:0;}

.underline {border-bottom:1px solid #333;}

.emotion-group {position:relative; padding:56px 80px; border:3px solid #333; border-radius:60px;}
.emotion-group .doc-tit {margin-bottom:80px;}

.measure {position:relative;}
.measure + .measure {margin-top:105px;}
.measure .caption {position:absolute; top:-30px; color:#333; font-family:var(--font-primary); line-height:1.3em;}
.measure .caption.left {left:0;}
.measure .caption.right {right:0;}

.radio-bar {position:relative; display:flex; justify-content:center;}
.radio-bar:before {content:""; width:100%; height:3px; background:#333; position: absolute; left:0; top:9px; z-index:-1;}
.radio-bar .item {margin:0 26px; display:flex; flex-direction:column; text-align:center;}
.radio-bar input[type='radio'] {border-radius:100%; appearance:none; width:22px; height:22px; border:3px solid #333; margin:0 !important;}
.radio-bar input[type='radio']:checked {background:var(--color-primary);}
.radio-bar input[type='radio']:checked + label {color:var(--color-primary);}
.radio-bar label {margin-top:18px; color:#999; font-family:var(--font-primary); line-height:1.3em;}

.explan-box {border-radius:30px; position:absolute; right:30px; bottom:30px; padding:20px; max-width:350px; background:#fff5ef; text-align:center;}
.explan-box .doc-txt2 {margin-bottom:11px;}
.explan-box p {color:#454545;}

.ing-emotion {display:flex; align-items:center;}
.ing-emotion .title {margin-right:140px; display:flex; align-items:center;}
.ing-emotion .title img {margin-right:40px;}
.ing-emotion .txt {flex:1 1 auto; min-width:0; width:1%; border-bottom:2px solid #333;}
.ing-emotion .txt input {text-align:center; width:100%; border:0; display:inline-block; margin-bottom:30px; font-size: 60px; font-family:var(--font-secondary); font-weight: 500; letter-spacing:-.03em; line-height:1.4em; color: #333;}

.blocker:not(.report-bloker) {background:rgba(207,237,255,0.7);}
.mood-pop a.close-modal {background:url("../images/sub/close.png") no-repeat 50% 50% / contain; width:31px; height:31px; right:0; top:-50px;}
.mood-pop {background-color:transparent; display:none; max-width:1200px; width:62.5vw; /* max-height:950px; height:96.93vh; */}
.mood-meter {padding:50px 27px 20px 90px;}
.mood-meter .inner {position:relative;}
.mood-meter .pos-text {display:flex; align-items:center;  justify-content:center; font-family:var(--font-primary); position:absolute; font-size:30px; letter-spacing:-.03em;}
.mood-meter .pos-text.text1,
.mood-meter .pos-text.text2 {margin-left:-65px; left:0; height:50%;}
.mood-meter .pos-text.text3,
.mood-meter .pos-text.text4 {margin-bottom:62px; bottom:0; width:50%;}
.mood-meter .pos-text.text1 {top:0;}
.mood-meter .pos-text.text2 {top:50%;}
.mood-meter .pos-text.text3 {left:0; width:50%;}
.mood-meter .pos-text.text4 {left:50%; }
.mood-list .row {display:flex; flex-wrap:wrap; margin:-25px -15px;}
.mood-list .col {width:50%; padding:25px 15px;}
.mood-list .item {position:relative;}
.mood-list .item1:after,
.mood-list .item3:after,
.mood-list .item3:before,
.mood-list .item4:after {position:absolute;  content:""; background-size:contain; background-repeat:no-repeat; background-position:50% 50%;}
.mood-list .item1:after,
.mood-list .item3:after {left:-20px; top:0; height:100%; width:8px;}
.mood-list .item3:before,
.mood-list .item4:after {bottom:-8px; width:100%; height:8px;}
.mood-list .item1:after {background-image: url("../images/sub/line1.png");}
.mood-list .item3:after {background-image: url("../images/sub/line2.png");}
.mood-list .item3:before {background-image: url("../images/sub/line3.png");}
.mood-list .item4:after {background-image: url("../images/sub/line4.png");}

.mood-list .item ul {margin:-13px -4px; display:flex; flex-wrap:wrap;}
.mood-list .item li {padding:13px 4px; width:20%;}

.mood-list button {padding:0 5px; font-weight:600; min-width:100px; border-radius:6px; color:#fff; line-height:1.3em; border:0; height:55px; width:100%; display:flex; align-items:center; justify-content:center; text-align:center; background:#ddd;}
.mood-list .item2 button {color:#333;}
.mood-list .item1 li:nth-child(5n+1) button {background:#821f22;}
.mood-list .item1 li:nth-child(5n+2) button {background:#bb2224;}
.mood-list .item1 li:nth-child(5n+3) button {background:#dd4726;}
.mood-list .item1 li:nth-child(5n+4) button {background:#f85627;}
.mood-list .item1 li:nth-child(5n+5) button {background:#f97b26;}

.mood-list .item2 li:nth-child(5n+1) button {background:#fae767;}
.mood-list .item2 li:nth-child(5n+2) button {background:#f9d539;}
.mood-list .item2 li:nth-child(5n+3) button {background:#f9cb3a;}
.mood-list .item2 li:nth-child(5n+4) button {background:#f9b83a;}
.mood-list .item2 li:nth-child(5n+5) button {background:#f9ad26;}

.mood-list .item3 li:nth-child(5n+1) button {background:#231f80;}
.mood-list .item3 li:nth-child(5n+2) button {background:#232299;}
.mood-list .item3 li:nth-child(5n+3) button {background:#2348ba;}
.mood-list .item3 li:nth-child(5n+4) button {background:#2672e2;}
.mood-list .item3 li:nth-child(5n+5) button {background:#26a4f0;}

.mood-list .item4 li:nth-child(5n+1) button {background:#9cd526;}
.mood-list .item4 li:nth-child(5n+2) button {background:#7ec124;}
.mood-list .item4 li:nth-child(5n+3) button {background:#66b123;}
.mood-list .item4 li:nth-child(5n+4) button {background:#23a626;}
.mood-list .item4 li:nth-child(5n+5) button {background:#228d23;}

.mood-tt {text-align:center; font-family:var(--font-primary); padding-top:100px;}

.blocker {display:flex; align-items:center; justify-content:center;}

.input-text {position:relative;}
.input-text .doc-txt2 {margin-bottom:15px;}
.input-text input {font-size:18px; width:100%; border:0; border-bottom:1px solid #ddd; padding-left:0;}
.input-text input::placeholder {border:0; color:#454545;  font-weight:400; letter-spacing:-.03em; font-family:var(--font-secondary);}
.doc-btn.search-btn {min-width:265px; height:60px; font-size:16px; position:absolute; right:0; bottom:12px;}
.doc-btn.search-btn:after {margin-left:26px; content:""; width:20px; height: 20px; background:url("../images/sub/search_ico.png") no-repeat 50% 50% / contain;}

.keyword-box {position:relative; padding:50px;}
.keyword-list {display:flex; flex-wrap:wrap; margin:7px;}
.keyword-list li {padding:7px; width:10%;}
.keyword-list .con {border-radius:6px; height:55px; display:flex; align-items:center; justify-content:center; text-align:center; background:var(--color-primary); text-align:center; color:#fff;}

.emotion-result {text-align:center; padding:165px 105px 120px; background:url("../images/sub/result_bg.png") no-repeat 50% 50% / 100% 100%; max-width:750px; margin:0 auto;}
.emotion-result .doc-txt2 {margin-bottom:10px;}
.emotion-result .cnt {margin-bottom:49px;}
.temper-bar {display:inline-flex; align-items:center; justify-content:center; position:relative;}
.temper-bar:after {border-radius:16px; content:""; border:2px solid #111; position: absolute; top:0; left:0; right:0; bottom:0;}
.temper-bar .num {line-height:32px; font-size:15px; font-family:var(--font-primary); width:32px; height:32px;}
.temper-bar .num.active {line-height:1.75em;background:var(--color-primary); color:#fff; font-size:18px; border:2px solid #111; border-radius:100%;}
.result-btns {display:flex; justify-content:center; align-items:center;}
.result-btns a + a {margin-left:20px;}
.share-btn {position:relative;}
.share-btn:before {margin-right:20px; content:""; width:31px; height:22px; background:url("../images/sub/share_ico.png") no-repeat 50% 50% / contain;}

.question-image {margin-bottom:35px; padding-top:88px; position:relative; display:inline-flex;}
.question-image .center-img {display:;}
.q-text {position:absolute; top:0; display:flex; flex-direction:column; align-items:center; text-align:center;}
.q-text.left {left:-310px;}
.q-text.right {right:-310px;}
.q-text .img {margin-bottom:22px;}
.q-text .txt-box {display:flex; flex-direction:column; justify-content:center; align-items:center; min-height:125px; min-width:260px; border-radius:30px; background-size:100% 100%; background-repeat:no-repeat; background-position:50% 50%;}
.q-text .txt-box.txt-box1 {padding:20px 49px 20px 30px;background-image: url("../images/sub/qna_txt_bg1.png");}
.q-text .txt-box.txt-box2 {padding:20px 30px 20px 49px;background-image: url("../images/sub/qna_txt_bg2.png");}

.center-box {margin-bottom:40px; display:flex; background:#f8f8f8; padding:50px; border-radius:30px;}
.center-box .map01 {width:560px; margin-right:60px; height:544px;}

.center-search-2 {flex:1 1 auto; min-width:0; width:1%; text-align:center;}
.center-search-2 h3 {margin:22px 0 16px; font-size:22px; font-weight:700; font-family:var(--font-secondary); color:var(--color-primary);}
.center-search-2 .doc-txt3 {color:#333;}
.center-search-2 .wrap {margin:35px 0 39px;}
.center-search-2 .row {margin-bottom:20px;}
.center-search-2 .row:last-child {margin-bottom:0;}
.center-search-2 .row .input {padding:6px 27px; height:60px; font-weight:500; color:#505050; border-radius:6px; width:100%; border:2px solid #777;}
.center-search-2 .row input::placeholder {font-weight:500; color:#505050;}

.center-list-2 {margin-bottom:60px; border-top:1px solid #242424;}
.center-list-2 h4 {margin-bottom:22px;}
.center-list-2 .row {position:relative; padding:30px 20px; border-bottom:1px solid #ddd;}
.center-list-2 .info {display:flex;}
.center-list-2 .info .txt {margin-right:50px;}
.center-list-2 .info .txt img {margin-right:13px; vertical-align:middle;}
.center-list-2 .info .txt:last-child {margin-right:0x;}
.go-btn {position:absolute; right:20px; top:50%; margin-top:-13px;}

.sweet-wrap {margin-bottom:100px; display:flex;}
.sweet-dog {margin-right:120px; display:flex; align-items:center; width:624px;}
.sweet-dog .img {margin-right:14px;}
.sweet-wrap .q-text {flex:1 1 auto; min-width:0; width:1%; position:relative;}
.sweet-wrap .q-text.dog-acc:before {left:auto; right:0; top:-46px;}
.sweet-wrap .q-text p {line-height:1.50em;}
.sweet-list {border-top:1px solid var(--color-primary); flex:1 1 auto; min-width:0; width:1%;}
.sweet-list li {align-items:center; display:flex; border-bottom:1px solid #ddd;}
.sweet-list li .ico {margin-right:2px;}
.sweet-list li .con {padding:25px 10px;flex:1 1 auto; min-width:0; width:1%;}


.chart-area {display:flex;}
.chart-wrap  {border-radius:30px; border:1px solid #ddd;}
.chart-wrap.left {padding:30px 45px 5px; flex:1 1 auto; min-width:0; width:1%;}

.chart1 .apexcharts-yaxis-label {color: #242424 !important; font-family:'Katuri', sans-serif !important; font-size: 14px !important; font-weight:500 !important;}
.chart1 .apexcharts-xaxis-label {border-color:#000; color: #242424 !important; font-family:'Katuri', sans-serif !important; font-size: 12px !important; font-weight:500 !important;}

.chart-circle-wrap {display:flex; align-items:center; justify-content:center; position: relative;width:445px ; margin-left:30px;}
.chart2 .apexcharts-legend {display:none;}
.chart-circle-wrap .center-txt {text-align:center;  position: absolute; left:50%; top:50%; transform:translate(-50%, -50%); z-index: 10;}

.doc-tit2 {font-weight: 400; font-family:var(--font-primary); font-size: 26px; line-height:1.31em;color: #242424;}