.comicList{background-color:#fdf3f4;padding:50px 0 60px}@media screen and (min-width:1180px){.comicList{padding:100px 0}}.comicList__item{margin-bottom:45px}@media screen and (min-width:1180px){.comicList__item{margin-bottom:0}}.comicList__item:last-child{margin-bottom:0}@media screen and (min-width:1180px){.comicList__item{-ms-grid-columns:248px 35px minmax(0,auto);grid-template-columns:248px minmax(0,auto);display:-ms-grid;display:grid;gap:50px 35px;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content}}.comicList__item__img{max-width:248px;margin:0 auto 30px}@media screen and (min-width:1180px){.comicList__item__img{-ms-grid-column:1;-ms-grid-column-span:1;grid-column:1/2;margin-bottom:0}}.comicList__item__img img{width:100%}.comicList__item__text{margin-bottom:28px}@media screen and (min-width:768px){.comicList__item__text{-ms-grid-column:2;-ms-grid-column-span:1;grid-column:2/3}}.comicList__item__text__title{font-size:1.7rem;color:#8e754e;font-family:var(--font-serif);font-weight:400;line-height:1.764;text-align:center;margin-bottom:26px}@media screen and (min-width:768px){.comicList__item__text__title{font-size:2.4rem;line-height:1.666;text-align:left;margin-bottom:18px}}.comicList__item__btn{margin:0 auto}.comicList__item__btn>*{pointer-events:none}@media screen and (min-width:768px){.comicList__item__btn{-ms-grid-column:1;-ms-grid-column-span:2;grid-column:1/3}}.comicList__item__modal{opacity:0;visibility:hidden;position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.8);z-index:100}.comicList__item__modal__inner{height:100%;display:-ms-grid;display:grid;-ms-grid-columns:minmax(20px,auto) 25px minmax(0,-webkit-max-content) 25px minmax(20px,auto);-ms-grid-columns:minmax(20px,auto) 25px minmax(0,max-content) 25px minmax(20px,auto);grid-template-columns:minmax(20px,auto) 25px minmax(0,-webkit-max-content) 25px minmax(20px,auto);grid-template-columns:minmax(20px,auto) 25px minmax(0,max-content) 25px minmax(20px,auto);-ms-grid-rows:auto 20px -webkit-min-content 20px auto;-ms-grid-rows:auto 20px min-content 20px auto;grid-template-rows:auto -webkit-min-content auto;grid-template-rows:auto min-content auto;grid-row-gap:20px}.comicList__item__modal__inner>:first-child{-ms-grid-row:1;-ms-grid-column:1}.comicList__item__modal__inner>:nth-child(2){-ms-grid-row:1;-ms-grid-column:2}.comicList__item__modal__inner>:nth-child(3){-ms-grid-row:1;-ms-grid-column:3}.comicList__item__modal__inner>:nth-child(4){-ms-grid-row:1;-ms-grid-column:4}.comicList__item__modal__inner>:nth-child(5){-ms-grid-row:1;-ms-grid-column:5}.comicList__item__modal__inner>:nth-child(6){-ms-grid-row:3;-ms-grid-column:1}.comicList__item__modal__inner>:nth-child(7){-ms-grid-row:3;-ms-grid-column:2}.comicList__item__modal__inner>:nth-child(8){-ms-grid-row:3;-ms-grid-column:3}.comicList__item__modal__inner>:nth-child(9){-ms-grid-row:3;-ms-grid-column:4}.comicList__item__modal__inner>:nth-child(10){-ms-grid-row:3;-ms-grid-column:5}.comicList__item__modal__inner>:nth-child(11){-ms-grid-row:5;-ms-grid-column:1}.comicList__item__modal__inner>:nth-child(12){-ms-grid-row:5;-ms-grid-column:2}.comicList__item__modal__inner>:nth-child(13){-ms-grid-row:5;-ms-grid-column:3}.comicList__item__modal__inner>:nth-child(14){-ms-grid-row:5;-ms-grid-column:4}.comicList__item__modal__inner>:nth-child(15){-ms-grid-row:5;-ms-grid-column:5}@media screen and (min-width:1154px){.comicList__item__modal__inner{-ms-grid-columns:50px minmax(0,auto) minmax(0,123px) minmax(0,-webkit-max-content) minmax(0,123px) minmax(0,auto) 50px;-ms-grid-columns:50px minmax(0,auto) minmax(0,123px) minmax(0,max-content) minmax(0,123px) minmax(0,auto) 50px;grid-template-columns:50px minmax(0,auto) minmax(0,123px) minmax(0,-webkit-max-content) minmax(0,123px) minmax(0,auto) 50px;grid-template-columns:50px minmax(0,auto) minmax(0,123px) minmax(0,max-content) minmax(0,123px) minmax(0,auto) 50px;grid-row-gap:10px}}.comicList__item__modal__inner .closeBtn{font-size:10px;color:#fff;-ms-grid-column:3;-ms-grid-column-span:2;grid-column:3/5;-ms-grid-row:1;-ms-grid-row-span:1;grid-row:1/2;-ms-grid-column-align:end;justify-self:end;-ms-grid-row-align:end;align-self:end;cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:8px}@media screen and (min-width:1154px){.comicList__item__modal__inner .closeBtn{font-size:2.8rem;-ms-grid-column:1;-ms-grid-column-span:6;grid-column:1/7;gap:30px}}.comicList__item__modal__inner .closeBtn img{width:20px}@media screen and (min-width:1154px){.comicList__item__modal__inner .closeBtn img{width:50px}}.comicList__item__modal__inner .comicViewer{max-width:400px;width:100%;overflow:hidden;-ms-grid-column:3;-ms-grid-column-span:1;grid-column:3/4;-ms-grid-row:2;-ms-grid-row-span:1;grid-row:2/3;-ms-grid-column-align:center;justify-self:center;-ms-grid-row-align:center;align-self:center;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content}@media screen and (min-width:1154px){.comicList__item__modal__inner .comicViewer{width:auto;max-height:70vh;max-width:none;-ms-grid-column:4;-ms-grid-column-span:1;grid-column:4/5}}.comicList__item__modal__inner .comicViewer__inner{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-flow:row-reverse;flex-flow:row-reverse}@media screen and (min-width:1154px){.comicList__item__modal__inner .comicViewer__inner{max-height:70vh}}.comicList__item__modal__inner .comicViewer__inner__item{max-width:485px;width:100%;-ms-flex-negative:0;flex-shrink:0}@media screen and (min-width:1154px){.comicList__item__modal__inner .comicViewer__inner__item{width:auto;max-width:none;max-height:70vh}}@media screen and (min-width:1154px){.comicList__item__modal__inner .comicViewer__inner__item img{max-height:70vh;width:auto}}.comicList__item__modal__inner__pager{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-ms-grid-column:2;-ms-grid-column-span:3;grid-column:2/5;-ms-grid-row:2;-ms-grid-row-span:1;grid-row:2/3;z-index:1;-ms-grid-row-align:center;align-self:center}@media screen and (min-width:1154px){.comicList__item__modal__inner__pager{-ms-grid-column:3;-ms-grid-column-span:3;grid-column:3/6}}.comicList__item__modal__inner__pager>div{width:38px;height:38px;background-color:var(--color-pink);border-radius:50%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;cursor:pointer;-webkit-transition:var(--hover-transition);transition:var(--hover-transition)}.comicList__item__modal__inner__pager>div img{width:14px}.comicList__item__modal__inner__pager>div:hover{opacity:0.7!important}.comicList__item__modal__inner__pager>div.comicList__item__modal__inner__pager__prev img{-webkit-transform:rotate(180deg);transform:rotate(180deg)}@media screen and (min-width:1154px){.comicList__item__modal__inner__pager>div{width:55px;height:55px}.comicList__item__modal__inner__pager>div img{width:auto}}.comicList__item__modal__inner__bottom{-ms-grid-column:3;-ms-grid-column-span:1;grid-column:3/4;-ms-grid-row:3;-ms-grid-row-span:1;grid-row:3/4;-ms-grid-row-align:center;align-self:center}@media screen and (min-width:1154px){.comicList__item__modal__inner__bottom{-ms-grid-column:1;-ms-grid-column-span:7;grid-column:1/8}}.comicList__item__modal__inner__title{font-size:1.6rem;color:#fff;font-family:var(--font-serif);font-weight:300;letter-spacing:0.2rem;line-height:1.625;text-align:center;margin-bottom:45px}@media screen and (min-width:1154px){.comicList__item__modal__inner__title{font-size:2.2rem;margin-bottom:20px}}.comicList__item__modal__inner__pagenation{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;gap:8px}.comicList__item__modal__inner__pagenation>div{background-color:#adadad;height:5px;width:33px;position:relative}@media screen and (min-width:1154px){.comicList__item__modal__inner__pagenation>div{width:70px}}.comicList__item__modal__inner__pagenation>div:root{--width:0}.comicList__item__modal__inner__pagenation>div:before{content:"";position:absolute;top:0;right:0;height:100%;width:var(--width);background-color:#fff}.comicList .pageInner{max-width:450px;margin-bottom:0}@media screen and (min-width:1180px){.comicList .pageInner{max-width:1200px;display:-ms-grid;display:grid;-ms-grid-columns:1fr 44px 1fr;grid-template-columns:repeat(2,1fr);gap:60px 44px}}