.por_main {}
.por_box {padding: 200px 15px; display: grid; gap: 30px;}
.por_tit {display: flex; align-items: end;}
.por_tit h1 {position: relative; display: block; font-size: 60px;}
.por_tit h1 img {position: absolute; width: 50px; right: -20px; top: -20px; z-index: -1;} 
/* .por_tit h1::after {content: ""; display: block; width: 40px; height: 40px; background: linear-gradient(to right, #73e473, #69b9a2); position: absolute; top: -15px; right: -15px; z-index: -1; border-radius: 100%;} */
.por_tit_deco_01 {margin-left: auto; font-size: 120px; font-weight: 900; opacity: 1; position: absolute; right: 0; top: -200px; z-index: -1;}

.por_tag_box {display: grid; gap: 15px;}
.por_tag_box h5 {font-size: 16px;}
.por_tag {display: grid; grid-template-columns: 150px auto; gap: 30px; align-items: center;}
.por_tag_list {display: flex; gap: 5px; flex-wrap: wrap;}
.por_tag_list li a {padding: 8px 20px 6px; align-items: center; border-radius: 20px; font-size: 14px; color: #999; display: block; box-shadow: 2px 2px 10px rgba(0,0,0,.1); transition: .1s;}
.por_tag_list li a:hover {background: #999; color: #fff;}
.por_tag_list li a#bo_cate_on {background: #73e473; color: #fff;}

.por_tag_list li button {padding: 8px 20px 6px; align-items: center; border-radius: 20px; font-size: 14px; color: #999; box-shadow: 2px 2px 10px rgba(0,0,0,.1); transition: .1s;}
.por_tag_list li button:hover {background: #999; color: #fff;}
.por_tag_list li button.on {background: #73e473; color: #fff;}

.por_detail_tit {display: grid; gap: 30px;}

.por_detail_tag_box {display: grid; gap: 15px;}
.por_detail_tag {}
.por_detail_tag_list {display: flex; gap: 5px; flex-wrap: wrap;}
.por_detail_tag_list li a {padding: 5px 15px; align-items: center; border-radius: 15px; font-size: 14px; color: #999; display: block; box-shadow: 2px 2px 10px rgba(0,0,0,.1); transition: .1s;}
.por_detail_tag_list li:hover a {background: #999; color: #fff;}
.por_detail_tag_list li.on a {background: #73e473; color: #fff;}

.por_detail {width: 100%; border-radius: 30px; overflow: hidden;}
.por_detail {width: 100%;}
.por_detail img {width: 100%; display: block;}
.por_detail br {display: none;}
.por_detail img+br {display: none;}
.por_detail iframe {width: 100%;}

.por_detail_prev {width: 50px; height: 100px; background: #999; position: fixed; top: 50%; transform: translateY(-50%); z-index: 1000; left: 0; border-radius: 0 50px 50px 0; padding: 0 10px; opacity: .5; transition: .3s; display: flex; align-items: center; cursor: pointer;}
.por_detail_next {width: 50px; height: 100px; background: #999; position: fixed; top: 50%; transform: translateY(-50%); z-index: 1000; right: 0; border-radius: 50px 0 0 50px; padding: 0 10px; opacity: .5; transition: .3s; display: flex; align-items: center; cursor: pointer;}

.por_detail_prev:hover {opacity: 1; background: #73e473;}
.por_detail_next:hover {opacity: 1; background: #73e473;}

.por_detail_link {position: fixed; bottom: 30px; left: 50%; transform: translateX(-50%); display: flex; gap: 15px; justify-content: center; width: 100%; padding: 0 15px; align-items: center;}

.por_detail_link li a { background: #fff; padding: 15px 30px; border-radius: 30px; display: block; text-align: center; font-size: 16px; opacity: .9; transition: .3s; border: 1px solid #ddd;}
.por_detail_link li.por_back a {padding: 15px;}
.por_detail_link li a:hover {opacity: 1; background: #fff; }
.por_detail_link li a img {width: 18px; display: block;}


.por_detail_etc {border-radius: 0; }
.por_detail_etc br {display: block;}
.por_detail_etc img {width: 100%; max-width: 1000px;}

.por_detail_hobby {border-radius: 0; }
.por_detail_hobby br {display: block;}
.por_detail_hobby a {max-width: 700px;}
.por_detail_hobby img {width: 100%; max-width: 700px;}


@media(max-width: 760px) {
    .por_box {padding: 120px 0;}
    .por_tit h1 {font-size: 36px;}
    .por_tit_deco_01 {display: none;}
    .por_tag {grid-template-columns: none; gap: 14px;}
    .por_tag_list {gap: 5px;}
    .por_tag_list li button {font-size: 12px;}
    .por_tag h5 {font-size: 16px;}

    .por_tag_list li a {font-size: 12px;}

    .por_detail_tag_list {gap: 5px;}
    .por_detail_tag_list li a {font-size: 12px;}

    .por_detail_prev {width: 30px; height: 60px; top: unset; bottom: 15px; transform: none;padding: 0 7px;}
    .por_detail_next {width: 30px; height: 60px; top: unset; bottom: 15px; transform: none;padding: 0 7px;}

    .por_detail_link {bottom: 15px;}
    .por_detail_link li a {font-size: 12px; padding: 15px;}
    .por_detail_link li a img {width: 15px; display: block;}


}