/* ========== custom s ========== */

.lines {
    width: 100%;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.lines.one {
    height: calc(19.6px * 1);
    -webkit-line-clamp: 1;
}

.lines.two {
    height: calc(19.6px * 2);
    -webkit-line-clamp: 2;
}

.lines.three {
    height: calc(19.6px * 3);
    -webkit-line-clamp: 3;
}

.lines.four {
    height: calc(19.6px * 4);
    -webkit-line-clamp: 4;
}

.lines.five {
    height: calc(19.6px * 5);
    -webkit-line-clamp: 5;
}

.lines.six {
    height: calc(19.6px * 6);
    -webkit-line-clamp: 6;
}

/*ui container s*/

.ui.container {
    margin-bottom: 3rem;
}

.ui.grid {
    margin-top: -1rem;
    margin-bottom: -1rem;
    margin-left: -.5rem;
    margin-right: -.5rem;
}

.ui.grid > .column:not(.row),
.ui.grid > .row > .column {
    position: relative;
    display: inline-block;
    width: 6.25%;
    padding-left: .5rem;
    padding-right: .5rem;
    vertical-align: top;
}

.header {
    font-size: inherit;
}

/*ui container e*/

/*ui header s*/

.ui.header.through {
    position: relative;
    text-align: center;
    overflow: hidden;

    margin-bottom: 1.5rem;
}

.ui.header.through::before,
.ui.header.through::after {
    position: relative;
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 100%;
    height: 1px;
    background-color: #ccc;
}

.ui.header.through::before {
    margin-left: -100%;
    right: 30px;
}

.ui.header.through::after {
    margin-right: -100%;
    left: 30px;
}

.ui.header .content {
    vertical-align: middle;
}

/*ui header e*/

/*ui grid s*/

.ui.image {
    /*margin-bottom: 1rem !important;*/
}

.ui.image img {
    /*width: 100%;*/
    /*height: auto;*/
}

/*ui grid e*/

/*ui items s*/

.ui.items .item {
    margin-bottom: 1rem !important;
}

/*ui items e*/

/*ui card s*/

.ui.card {
    width: 100% !important;
}

.ui.card:hover .content .meta .price {
    color: #f485a1;
}

/*ui card e*/

/*header-bar s*/

.header-bar {
    margin-bottom: 1.5rem;
    border-bottom: 1px solid #ddd;
}

.header-bar .ui.container {
    margin-bottom: 0 !important;
}

.header-bar .text-bar {
    line-height: 2;
}

/*header-bar e*/

/*header s*/

header .ui.container {
    margin-bottom: 1rem;
}

header .main-logo {
}

.tablet-img {
    display: none;
}

header .ui.list {
    margin-left: 0 !important;
}

header .ui.list.red > li {
    list-style: none;
    color: #db2828;
    font-weight: bold;
}

header .ui.list.red > li:before {
    display: none;
}

header .column:nth-of-type(1) {
    left: calc(100% / 16 * 8);
}

header .column:nth-of-type(2) {
    right: calc(100% / 16 * 6);
}

header .column:nth-of-type(3) {
    right: calc(100% / 16 * 6);
}

header {
    padding-top: 10px;
    padding-bottom: 5px;
}

header .ui.grid {
    margin-left: 5px;
    margin-right: 5px;
}

header .ui.grid > * {
    padding-left: 5px;
    padding-right: 5px;
}

header .header-01,
header .header-02,
header .header-03 {
    width: calc(100% / 3);
    float: left;
}

header .header-01 .main-logo {
    display: block;
}

header .header-01 .main-logo img {
    width: auto;
    height: 100%;
    max-height: 90px;
}

header .header-02 ul li {
    font-weight: normal !important;
}

header .header-03 .pic-box {
    margin-bottom: 5px;
}

header .header-03 .pic-box img {
    width: 100%;
    height: auto;
}

/*header e*/

/*nav s*/

.ui.menu.main {
    border-radius: 0 !important;
    border-left: none;
    border-right: none;
    background: #f485a1;
}

.ui.menu-grid {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.ui.menu.main .item {
    color: #fff !important;
    text-align: center;
}

/*nav e*/

/*breadcrumb s*/

.breadcrumb-box {
    margin-bottom: 1.5rem !important;
}

/*breadcrumb e*/

/*box-01 s*/

.box-01 {
    margin-bottom: 4rem !important;
}

.slider {
    width: 100%;
    /*margin: 100px auto;*/
}

.slick-prev {
    left: 25px;
    z-index: 1;
}

.slick-next {
    right: 25px;
    z-index: 1;
}

.slick-slide {
    margin: 0;
}

.slick-slide img {
    width: 100%;
}

.slick-prev:before,
.slick-next:before {
    color: black;
}

.slick-slide {
    transition: all ease-in-out .3s;
    opacity: .2;
}

.slick-active {
    opacity: .5;
}

.slick-current {
    opacity: 1;
}

/*box-01 e*/

/*box-02 s*/

.box-02 {
}

.box-02 .ui.placeholder.segment {
    min-height: auto;
}

.box-02 .ui.placeholder.segment > .item + .item {
    margin-top: .5rem;
}

.box-02 .ui.list .list > span.item {
    color: #333 !important;
    font-size: 1.2rem;
    font-weight: bold;
}

.box-02 .ui.list .list > a.item {
    color: #333 !important;
    font-size: 1rem;
}

/*box-02 e*/

/*box-03 s*/

.box-03 {
}

.box-03 .ui.grid img {
    width: 100%;
    height: auto;
}

.box-03 .ui.card {
    /*width: 100% !important;*/
}

.box-03 .ui.card .content .header,
.box-03 .ui.card .content .description {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.box-03 .ui.card .content .meta .price {
    color: red;
    font-size: 1.6rem;
    font-weight: bold;
}

/*box-03 e*/

/*box-04 s*/

.box-04 {
}

.box-04 .ui.card .content .header {
    color: #f485a1;
    font-size: 1rem !important;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

/*box-04 e*/

/*box-05 s*/

.box-05 {
}

.box-05 .ui.grid .content .header {
    text-align: center;
    font-size: 1.6rem;
    font-weight: bold;
}

.box-05 .ui.grid .content .description > p {
    font-size: 1rem !important;
    line-height: 2 !important;
}

/*box-05 e*/

/*box-06 s*/

.box-06 {
}

.box-06 .ui.card .content .header {
    color: #f485a1;
    font-size: 1rem !important;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

/*box-06 e*/

/*box-07 s*/

.box-07 {
}

.box-07 .ui.segment {
    padding: .3em .3em;
    overflow: hidden;
}

.box-07 .ui.segment img {
    width: 100%;
    height: auto;
    margin-bottom: -4px;
}

.box-07 .ui.card .content .header {
    color: #f485a1;
    font-size: 1rem !important;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.box-07 .more-link {
    width: 100%;
    text-align: right;
    margin-top: -2rem;
}

.box-07 .style-01 .more-link {
    margin-top: .75rem;
}

.box-07 .more-link > a {
    display: inline-block;
}

.ui.user.button {
    background-color: #f485a1;
    color: #fff;
    text-shadow: none;
    background-image: none;
}

/*box-07 e*/

/*box-08 s*/

.box-08 {
}

.box-08 .ui.list .item .header,
.box-08 .ui.list .item .header:hover {
    color: #f485a1 !important;
    margin-bottom: .75rem;
}

/*box-08 e*/

/*box-09 s*/

.box-09 {
}

.box-09 .ui.segment.top {
    min-height: 15rem;
    background: #fff3a9;
}

.box-09 .ui.segment.top .ui.header > p {
    margin-bottom: .5rem !important;
}

.box-09 .ui.segment.top .ui.header > p:last-child {
    font-size: 1.5rem;
}

.box-09 .ui.segment.top .content {
    display: inline-block;
    font-weight: bold;
    padding: 1rem 2rem;
    border-radius: 5rem;
    background: #fff;
}

.box-09 .ui.segment.top .content p {
    margin-bottom: 0 !important;
}

.box-09 .ui.segment.top .content .inline > * {
    display: inline-block;
    margin-right: 1rem;
}

.box-09 .ui.segment.top .content .inline .fa-heart {
    color: #f485a1;
}

.box-09 .ui.segment.top .content .inline .fa-square {
    color: #ddd;
}

.box-09 .ui.segment.bottom {
    background: #fffcdf;
}

.box-09 .ui.segment.bottom .left-box,
.box-09 .ui.segment.bottom .right-box {
    padding: 1.5rem 3rem;
}

.box-09 .ui.segment.bottom .left-box > p,
.box-09 .ui.segment.bottom .right-box > p {
    color: #f485a1;
    font-size: 1.2rem;
    font-weight: bold;
}

.table-calendar {
    border: none;
    border-radius: 15px;
    background: #fff;
    overflow: hidden;
}

.table-calendar > thead > tr > td,
.table-calendar > thead > tr > th {
    color: #784e34 !important;
    background: #ffe3e3 !important;
}

.table-calendar > tbody > tr > td,
.table-calendar > tbody > tr > th,
.table-calendar > tfoot > tr > td,
.table-calendar > tfoot > tr > th,
.table-calendar > thead > tr > td,
.table-calendar > thead > tr > th {
    position: relative;
    text-align: center !important;
}

.table-calendar tr > td span,
.table-calendar tr > th span {
    position: relative;
    color: #784e34;
    display: block;
    border-radius: 20px;
}

.table-calendar tr > th span {
    color: #0090c6;
    background: #ddd;
}

.calendar-01 tbody > tr:nth-of-type(1) > td:nth-of-type(3) span,
.calendar-01 tbody > tr:nth-of-type(2) > td:nth-of-type(1) span {
    position: relative;
    color: #ff2635;
    background: #ddd;
}

.calendar-01 tbody > tr:nth-of-type(1) > td:nth-of-type(4) span {
    position: relative;
    background: #ddd;
}

.calendar-01 tbody > tr:nth-of-type(2) > td:nth-of-type(4) span {
    position: relative;
    color: #fff;
    z-index: 1;
}

.calendar-01 tbody > tr:nth-of-type(2) > td:nth-of-type(4) span:after {
    content: "\f004";
    position: absolute;
    top: -3px;
    left: 50%;
    transform: translateX(-50%);
    color: #f485a1;
    font: normal normal normal 28px/1 FontAwesome;
    z-index: -1;
}

.calendar-02 tbody > tr:nth-of-type(2) > td:nth-of-type(1) span,
.calendar-02 tbody > tr:nth-of-type(3) > td:nth-of-type(1) span,
.calendar-02 tbody > tr:nth-of-type(4) > td:nth-of-type(1) span,
.calendar-02 tbody > tr:nth-of-type(5) > td:nth-of-type(1) span {
    position: relative;
    background: #ddd;
}

/*box-09 e*/

/*box-10 s*/

.box-10 {
}

.box-10 .title-box {
    padding-bottom: 1rem;
}

.box-10 .title-box .ui.header {
    color: #fff;
}

.box-10 .content {
    font-size: 1.2rem;
}

.box-10 .content .pic-group {
    margin-bottom: .5rem;
}

.box-10 .content img {
    width: 100%;
    height: auto;
}

/*box-10 e*/

/*box-11 s*/

.box-11 {
}

.box-11 .title-box {
    padding-bottom: 1rem;
}

.box-11 .left {
    right: calc(100% / 16 * 12);
}

.box-11 .right {
    left: calc(100% / 16 * 4);
}

.box-11 .right .ui.grid {
    margin-bottom: 15px;
}

.box-11 .ui.list > div.item:first-child {
    background: #f06292;
}

.box-11 .ui.list > div.item:first-child .header {
    color: #fff;
    line-height: 2.2;
}

.box-11 .ui.list > div.item .content {
    display: block;
    color: #333;
    line-height: 2;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.box-11 .ui.list > div.item:not(:first-child):hover {
    display: block;
    color: #333;
    background: #f5f5f5;
}

/*box-11 e*/

/*box-11 s*/

.pic-list .pic-box {
    position: relative;
    width: 100%;
    float: left;
    background: #f5f5f5;
}

.pic-list:nth-of-type(odd) .pic-box {
    padding-top: 80px;
}

.pic-list:nth-of-type(even) .pic-box {
    padding-bottom: 80px;
}

.pic-list .pic-box .title {
    position: absolute;
    left: 0;
    right: 0;
    padding: 5px;
    background: #ffe1e9;
}

.pic-list .title p {
    display: inline-block;
    float: left;
    margin-bottom: 0;
}

.pic-list .title p:nth-of-type(1) {
    width: 70px;
    height: 70px;
    text-align: center;
    line-height: 70px;
    margin-right: 15px;
    border-radius: 100%;
    background: #fff;
}

.pic-list .title p:nth-of-type(2) {
    padding-top: 15px;
}

.pic-list .title p:nth-of-type(2) span {
    display: block;
    font-size: 1.2rem;
    font-weight: bold;
}

.pic-list:nth-of-type(odd) .title {
    top: 0;
}

.pic-list:nth-of-type(odd) .title:before {
    position: absolute;
    bottom: -20px;
    left: 50%;
    transform: translateX(-50%);
    content: "";
    width: 0;
    height: 0;
    border-top: 20px solid #ffe1e9;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
}

.pic-list:nth-of-type(even) .title {
    bottom: 0;
}

.pic-list:nth-of-type(even) .title:before {
    position: absolute;
    top: -20px;
    left: 50%;
    transform: translateX(-50%);
    content: "";
    width: 0;
    height: 0;
    border-left: 20px solid transparent;
    border-right: 20px solid transparent;
    border-bottom: 20px solid #ffe1e9;
}

.pic-list .pic-box .image-box {
    display: block;
}

.pic-list .image-box img {
    width: 100%;
    height: auto;
    margin-bottom: -5px;
}

/*box-11 e*/

/*box-120 s*/

.box-12 {
}

.box-12 .ui.grid {
    margin-left: -1rem;
    margin-right: -1rem;
}

.box-12 .ui.grid > .column:not(.row),
.box-12 .ui.grid > .row > .column {
    padding-left: 1rem;
    padding-right: 1rem;
}

/*slick s*/

.box-12 .slick-prev {
    left: 25px;
    z-index: 1;
}

.box-12 .slick-next {
    right: 25px;
    z-index: 1;
}

.box-12 .slick-dots {
    position: relative;
    top: 10px;
    display: block;
    width: calc(100% + 10px);
    float: left;
    margin-left: -5px;
    margin-right: -5px;
}

.box-12 .slick-dots li {
    width: 20%;
    height: 140px;
    margin: 0;
    padding: 0 5px;
    float: left;
}

.box-12 .slick-dots li button {
    width: 100%;
    height: auto;
    float: left;
    padding: 0;
    margin: 0;
}

.box-12 .slick-dots li button:before {
    display: none;
}

.box-12 .slick-dots li button.thumbnail img {
    width: 100%;
    height: auto;
    opacity: 0.8;
}

.box-12 .slick-dots li button.thumbnail img {
    opacity: 0.6;
}

.box-12 .slick-dots li button.thumbnail:hover img,
.box-12 .slick-dots .slick-active .thumbnail img {
    opacity: 1;
}

.box-12 .right > .title-box {
    width: 100%;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid #ddd;
}

.box-12 .right > .title-box > h1 {
}

.box-12 .right > .price {
    width: 100%;
    color: #999;
    font-size: 1.2rem;
    margin-bottom: 1rem;
    border-bottom: 1px solid #ddd;
}

.box-12 .right > .price > p {
    display: inline-block;
}

.box-12 .right > .price > p:nth-of-type(1) > span:nth-of-type(1) {
    color: #f00;
    font-size: 2rem;
    font-weight: bold;
}

.box-12 .ui.vertical.menu {
    width: 100%;
    margin-bottom: 2rem;
}

.box-12 .ui.accordion.menu .item .title {
    font-weight: bold;
}

.box-12 .ui.accordion.menu .item .title > .dropdown.icon {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
}

.box-12 .ui.accordion.menu .item .active.title > .dropdown.icon {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

.box-12 .ui.accordion.menu .item .content .fields .field {
    display: inline-flex;
    margin-right: 15px;
}

.box-12 .ui.form .field > label {
    display: flex;
}

.box-12 .ui.accordion.menu .item .content .fields .field label .content {
    margin-left: 10px;
}

.box-12 .ui.accordion.menu .item .content .fields .field label .content > img {
    margin-bottom: 10px;
}

.box-12 .ui.accordion.menu .item .content .fields .field label .content > * {
    display: flex;
}

.box-12 .product-info {
    width: 100%;
    margin-left: 0 !important;
    margin-bottom: 2rem !important;
}

.box-12 .product-info > li {
    line-height: 1.6 !important;
}

.box-12 .product-info > li:before {
    display: none;
    margin-left: 0;
}

.box-12 .total-box {
    width: 100%;
    margin-bottom: 2rem;
}

.box-12 .total-box > .price > span {
    color: #f00;
    font-size: 2rem;
    font-weight: bold;
}

.box-12 .total-box > .ui.input {
    margin-bottom: 1rem;
}

.box-12 .total-box > .ui.input > input[type='text'] {
    margin-right: 1rem;
}

/*slick e*/

/*box-12 e*/

/*box-13 s*/

.box-13 {
}

.box-13 .column > .header {
    color: #fff;
    line-height: 2.8;
    font-weight: bold;
    padding: 0 1rem;
    background: #f06292;
}

/*box-13 e*/

/*box-14 s*/

.box-14 {
}

.box-14 img {
    width: 100%;
    height: auto;
    margin-bottom: -4px;
}

.box-14 .ui.segment {
    padding: .3em .3em;
    overflow: hidden;
}

.box-14 > .header {
    color: #fff;
    line-height: 2.8;
    font-weight: bold;
    padding: 0 1rem;
    margin-bottom: 1rem;
    background: #f06292;
}

/*box-14 e*/

/*box-15 s*/

.box-15 {
}

.box-15 img {
    width: 100%;
    height: auto;
    margin-bottom: -4px;
}

.box-15 > .header {
    color: #fff;
    line-height: 2.8;
    font-weight: bold;
    padding: 0 1rem;
    margin-bottom: 1rem;
    background: #f06292;
}

.box-15 .ui.items > .item:first-child {
    margin-top: 1em;
}

/*box-15 e*/

/*box-16 s*/

.box-16 {
}

.box-16 img {
    width: 100%;
    height: auto;
    margin-bottom: -4px;
}

.box-16 > .header {
    color: #fff;
    line-height: 2.8;
    font-weight: bold;
    padding: 0 1rem;
    margin-bottom: 1rem;
    background: #f06292;
}

/*box-16 e*/

/*box-17 s*/

.box-17 {
}

.box-17 img {
    width: 100%;
    height: auto;
    margin-bottom: -4px;
}

.box-17 > .header {
    color: #fff;
    line-height: 2.8;
    font-weight: bold;
    padding: 0 1rem;
    margin-bottom: 1rem;
    background: #f06292;
}

.box-17 > .content.video {
    text-align: center;
    margin: 0 15%;
}

.box-17 > .content.video video {
    width: 100%;
}

/*box-17 e*/

/*box-18 s*/

.box-18 {
}

.box-18 img {
    width: 100%;
    height: auto;
    margin-bottom: -4px;
}

.box-18 .column > .header {
    color: #fff;
    line-height: 2.8;
    font-weight: bold;
    padding: 0 1rem;
    background: #f06292;
}

.box-18 .column .items .item .content > .header {
    width: 100%;
    color: #fff;
    font-size: 1rem;
    line-height: 2.8;
    font-weight: bold;
    padding: 0 1rem;
    margin: 0;
    background: #f06292;
}

/*box-18 e*/

/*box-19 s*/

.box-19 {
}

.box-19 > .header {
    color: #fff;
    line-height: 2.8;
    font-weight: bold;
    padding: 0 1rem;
    margin-bottom: 1rem;
    background: #f06292;
}

.box-19 .ui.card .content .header {
    font-size: 1rem;
    font-weight: bold;
}

.box-19 .ui.card .content .meta .price {
    color: #f485a1;
}

/*box-19 e*/

/*box-20 s*/

.box-20 {
}

.box-20 .item .ui.card .content .header {
    display: block;
    font-size: 1rem;
    font-weight: bold;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

/*box-20 e*/

/*box-21 s*/

.box-21 {
}

.box-21 img {
    width: 100%;
    height: auto;
}

.box-21 video {
    width: 100%;
    height: auto;
}

.box-21 .ui.header .header {
    font-size: 1.5rem;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid #ddd;
}

.box-21 .ui.header .content span {
    display: inline-block;
    font-size: 1rem;
    margin-right: 10px;
}

.box-21 .ui.header .content span .fa {
    color: #777;
    margin-right: 5px;
}

.box-21 .ui.header .content .star-box {
    display: inline-block;
    color: orange;
}

.box-21 .ui.card {
    padding: 15px;
    background: #333;
}

.box-21 .ui.card .content .header {
    color: #efefef;
    font-size: 1.8rem;
    font-weight: bold;
    line-height: 1.2;
    padding-bottom: 10px;
    margin-bottom: 15px;
    border-bottom: 1px solid #444;
}

.box-21 .ui.card .content .description {
    color: #ddd;
    padding-bottom: 15px;
    margin-bottom: 15px;
    border-bottom: 1px solid #444;
}

.box-21 .ui.card .content .description .title {
    color: #ccc;
    font-size: 1.2rem;
    margin-bottom: 5px;
}

/*box-21 e*/

/*box-22 s*/

.box-22 {
}

.box-22 .ui.tabular.menu .item {
    font-weight: bold;
}

.box-22 .ui.tabular.menu .active.item {
    color: #fff;
    font-weight: bold;
    margin-bottom: -1px;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 0 !important;
    background: #333;
}

.box-22 .ui.segment {
    padding-left: 0;
    padding-right: 0;
    border: none;
}

.box-22 .ui.segment .ui.card video {
    display: block;
    width: 100%;
}

/*box-22 e*/

/*box-23 s*/

.box-23 {
}

.box-23 .ui.table thead tr > th {
    text-align: center;
    color: #fff;
    font-size: 1.5rem;
    font-weight: bold;
    background: #b80013;
}

.box-23 .ui.table tbody tr > td:first-child {
    background: #f5f5f5;
}

/*box-23 e*/

/*box-24 s*/

.box-24 {
}

.box-24 .ui.header {
    text-align: center;
    color: #b80013;
    font-size: 1.5rem;
    padding-top: 10px;
    padding-bottom: 10px;
    border-top: 3px solid #b80013;
    border-bottom: 3px solid #b80013;
}

.box-24 .content .title {
    text-align: center;
    font-size: 1.2rem;
    font-weight: bold;
    margin-bottom: 0;
}

.box-24 .content .info {
    text-align: center;
    color: #b80013;
    font-size: 1.2rem;
    font-weight: bold;
}

.box-24 .content .btn-box {
    text-align: center;
}

.box-24 .content .btn-box .ui.button {
    display: inline-block;
    width: 80%;
}

.box-24 .content .img-list {
    position: relative;
    min-height: 400px;
    overflow: hidden;
    margin: 50px 0;
}

.box-24 .content .img-list .title {
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);

    width: 100%;
    height: 120px;
    text-align: left;
    padding: 15px 0 0 50px;
    background: #f5f5f5;
}

.box-24 .content .img-list .img-box {
    position: absolute;
    top: 50%;
    left: 300px;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.box-24 .content .img-list .img-box .image {
    display: inline-block;
}

.box-24 .content .img-list .img-box img {
    width: auto;
    height: auto;
    max-height: 200px;
}

.box-24 .content .img-list .img-box .image:nth-of-type(1) img,
.box-24 .content .img-list .img-box .image:nth-of-type(4) img {
    max-height: 160px;
}

.box-24 .content .img-list .img-box .image:nth-of-type(3) img,
.box-24 .content .img-list .img-box .image:nth-of-type(6) img {
    max-height: 120px;
}

.box-24 .content .img-list .img-box .image:nth-of-type(1) {
    margin-left: 50px;
}

.box-24 .content .img-list .img-box .image:nth-of-type(4),
.box-24 .content .img-list .img-box .image:nth-of-type(6) {
    vertical-align: top;
}

/*box-24 e*/

/*box-25 s*/

.box-25 {
}

.box-25 .ui.header .content {
    width: 100%;
}

.box-25 .ui.header {
    padding-bottom: 5px;
    border-bottom: 1px solid #ddd;
}

.box-25 .ui.header .more-link {
    float: right;
}

/*box-25 e*/

/*box-26 s*/

.box-26 {
}

.box-26 .ui.segment {
    padding: .3em .3em;
    overflow: hidden;
}

.box-26 .ui.segment img {
    width: 100%;
    height: auto;
    margin-bottom: -4px;
}

.box-26 .ui.card .content .header {
    color: #f485a1;
    font-size: 1rem !important;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.box-26 .ui.grid .ui.card video {
    display: block;
    width: 100%;
}

.box-26 .more-link {
    width: 100%;
    text-align: right;
    margin-top: .75rem;
}

.box-26 .more-link > a {
    display: inline-block;
}

.ui.user.button {
    background-color: #f485a1;
    color: #fff;
    text-shadow: none;
    background-image: none;
}

/*box-26 e*/

/*box-27 s*/

.box-27 {
}

.box-27 .ui.card .content .header {
    color: #f485a1;
    font-size: 1rem !important;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.box-27 .ui.grid .ui.card video {
    display: block;
    width: 100%;
}

.box-27 .more-link {
    width: 100%;
    text-align: right;
    margin-top: -2rem;
}

.box-27 .more-link > a {
    display: inline-block;
}

.ui.user.button {
    background-color: #f485a1;
    color: #fff;
    text-shadow: none;
    background-image: none;
}

/*box-27 e*/

/*box-28 s*/

.box-28 {
}

.box-28 .title {
    text-align: center;
    font-size: 1.2rem;
    font-weight: bold;
}

.box-28 .title-box {
    padding: 15px;
    border: 1px solid #ddd;
}

.box-28 .title-box .star-box {
    margin-bottom: 5px;
}

.box-28 .title-box .star-box span {
    margin-left: 5px;
}

.box-28 .title-box .star-box .fa-star {
    color: orange;
}

.box-28 .title-box .star-box .fa-star-o {
    color: grey;
}

.box-28 .title-box .ui.items .item {
    margin-bottom: 0 !important;
}

.box-28 .title-box .ui.items .item .content .price {
    color: #f00;
}

.box-28 .item {
    padding: 15px 0;
}

.box-28 .item + .item {
    border-top: 1px solid #ddd;
}

.box-28 .item:nth-last-of-type(2) {
    border-bottom: 1px solid #ddd;
}

.box-28 .ui.grid img {
    width: 100%;
    height: auto;
}

.box-28 .ui.grid .left .image {
    margin-bottom: 10px;
}

.box-28 .ui.grid .left .price {
    color: #f00;
}

.box-28 .ui.grid .middle .star-box {
    color: orange;
}

.box-28 .ui.grid .right .header {
    font-weight: bold;
}

.box-28 .ui.grid .right .header img {
    width: auto;
    height: 100%;
    margin-right: 5px;
}

.box-28 .ui.grid .right .description {
    margin-bottom: 10px;
}

.box-28 .ui.pagination {
    margin-top: 30px;
    border-top: 1px solid #ddd;
}

/*box-28 e*/

/*box-29 s*/

.box-29 {
}

.box-29 .image img {
    width: 100%;
    height: auto;
}

.box-29 .ui.menu {
    padding: 0;
    margin-bottom: 15px;
    border-bottom: 1px solid #ddd;
}

.box-29 .tab.ui.segment {
    padding: 0;
    border: none;
}

.box-29 .tab.ui.segment .ui.card .content {
    padding: 5px;
    margin-bottom: 10px;
}

.box-29 .tab.ui.segment .ui.card .content .header {
    font-size: 16px;
}

.box-29 .tab.ui.segment .ui.grid {
    padding: 5px;
    margin-bottom: 0;
}

.box-29 .tab.ui.segment .ui.grid .column {
    padding-top: 5px;
    padding-bottom: 5px;
}

.box-29 .tab.ui.segment .ui.grid .summary {
    width: 100%;
    display: -webkit-box;
    float: left;
    -webkit-box-orient: vertical;
    height: calc(19.6px * 3);
    -webkit-line-clamp: 3;
    overflow: hidden;
}

.box-29 .tab.ui.segment .ui.card .ui.list {
    padding-left: 5px;
    padding-right: 5px;
    margin-bottom: 0;
}

.box-29 .tab.ui.segment .ui.table,
.box-29 .tab.ui.segment .ui.list {
    margin-bottom: 30px;
}

.box-29 .tab.ui.segment > .ui.list a.item {
    color: #777;
    padding: 5px 10px !important;
    border: 1px solid #ddd;
}

/*box-29 e*/

/*box-30 s*/
.box-30 {}

.box-30 .column .ranking {
    text-align: center;
    margin-bottom: 5px;
}

.box-30 .column .ranking img {
    width: auto;
    height: 100%;
}

.box-30 .column .pic-box img {
    width: 100%;
    height: auto;
}

.box-30 .column .marker {
    margin-bottom: 5px;
}

.box-30 .column .title {
    display: block;
    color: #f485a1;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-bottom: 10px;
}

.box-30 .column .price {
    margin-bottom: 0;
}

.box-30 .column .price span {
    display: block;
}

.box-30 .column .price span:nth-of-type(1) {
    color: red;
    font-weight: bold;
}

.box-30 .column .discount {
    margin-bottom: 5px;
}

.box-30 .column .discount span {
    color: #f485a1;
}

.box-30 .column .in-store {
    color: #70c13f;
}

.box-30 .more-link {
    text-align: right;
    margin-top: 20px;
}

/*box-30 e*/

/*box-31 s*/
.box-31 {}

.box-31 .ui.header {
    color: #f00;
    font-size: 22px;
}

.box-31 .ui.grid .column img {
    width: 100%;
    height: auto;
}

.box-31 .ui.grid .column .item {
    padding: 5px;
    border-radius: 10px;
    border: 3px solid lightblue;
}

.box-31 .column .title {
    display: block;
    color: #000;
    font-size: 1.25rem;
    font-weight: bold;
    margin-bottom: 10px;
}

.box-31 .column .pic-box {
    display: block;
    margin-bottom: 10px;
}

.box-31 .column .info .price-box p {
    display: inline-block;
    font-size: 1.15rem;
    margin-bottom: 5px;
}

.box-31 .column .info .price-box .price span {
    color: red;
    font-weight: bold;
}

.box-31 .column .info .price-box .star {
    float: right;
    text-align: right;
}

.box-31 .column .info .price-box .star .fa {
    color: orange;
}

.box-31 .column .info .del-price {
    display: inline-block;
    font-size: 1.15rem;
    margin-bottom: 10px;
}

.box-31 .column .info .del-price span {
    color: red;
    font-weight: bold;
}

.box-31 .column .info .down {
    color: purple;
    font-size: 1.15rem;
    font-weight: bold;
    margin-bottom: 5px;
}

.box-31 .column .info .summary {
    font-size: 1.15rem;
    font-weight: bold;
}

.box-31 .more-link {
    text-align: right;
    margin-top: 20px;
}

/*box-31 e*/

/*box-32 s*/
.box-32 {}

.box-32 .ui.column .column .box {
    padding: 5px;
    border: 1px solid #ddd;
}

.box-32 .column .info {
    font-size: 14px;
    font-weight: bold;
}

.box-32 .column .p-title {
    display: -webkit-box;
    float: left;
    width: 100%;
    height: calc(19.6px * 2);
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    color: #333;
    margin-bottom: 10px;
    overflow: hidden;
}

.box-32 .column .price {
    text-align: right;
}

.box-32 .column .tags > a {
    display: inline-block;
    color: #f485a1;
    margin-right: 5px;
}

.box-32 .column .more-link {
    text-align: center;
}

.box-32 .column .more-link > a {
    display: inline-block;
    color: #fff;
    margin-right: 5px;
}

/*box-32 e*/

/*box-33 s*/
.box-33 {}

.box-33 .content {
    font-size: 16px;
    padding: 10px;
    border: 1px solid #f485a1;
    border-radius: 5px;
}

.box-33 .content .title {
    font-size: 18px;
    font-weight: bold;
}

/*box-33 e*/

/*box-34 s*/
.box-34 {}

.box-34 .ui.box {
    margin-bottom: 30px;
}

.box-34 .ui.tags .title {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 10px;
    border-bottom: 1px solid #ddd;
}

.box-34 .ui.tags .title > * {
    padding-bottom: 5px;
}

.box-34 .ui.tags .tags-list > a {
    display: inline-block;
    color: #333;
    padding: 2px 5px;
    margin: 3px;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.box-34 .ui.tags .tags-list > a:before {
    content: "\f02b";
    font: normal normal normal 14px/1 FontAwesome;
    padding-right: 5px;
}

.box-34 .ui.ranking {
    padding: 5px;
    border: 1px solid #ddd;
    border-top: 3px solid #f485a1;
}

.box-34 .ui.ranking .title {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 10px;
    border-bottom: 1px dashed #ddd;
}

.box-34 .ui.ranking .title > * {
    padding-bottom: 5px;
}

.box-34 .ui.ranking .ui.list .ui.image {
    display: inline-block;
    width: 85px;
    height: auto;
}

.box-34 .ui.ranking .ui.list .content {
    display: inline-block;
    width: calc(100% - 90px);
}

.box-34 .ui.ranking .ui.list .ui.image .conner {
    position: absolute;
    top: 5px;
    left: 5px;
}

.box-34 .ui.ranking .ui.list .ui.image .conner span {
    display: block;
    text-align: center;
    color: #fff;
    font-size: 12px;
    padding: 3px;
    border-radius: 100%;
    background: #f00;
}

.box-34 .ui.ranking .ui.list .ui.image .conner.grey span {
    background: #555;
}

.box-34 .ranking .ui.list .content a.header {
    font-size: 14px;
    font-weight: normal;
}

.box-34 .ranking .ui.list .description .price {
    color: #f485a1;
    font-weight: bold;
}

.box-34 .ranking .more {
    text-align: center;
    padding-top: 5px;
    border-top: 1px solid #ddd;
}

.box-34 .ranking .more > a {
    display: inline-block;
    color: #fff;
    padding: 5px 10px;
    /*border: 1px solid #ddd;*/
    border-radius: 5px;
    background: #f485a1;
}

.box-34 .ui.hot {
    padding: 5px;
    border: 1px solid #ddd;
    border-top: 3px solid #f485a1;
}

.box-34 .ui.hot .title {
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 10px;
    border-bottom: 1px dashed #ddd;
}

.box-34 .ui.hot .title > * {
    padding-bottom: 5px;
}

.box-34 .ui.hot ul {
    list-style: none;
    padding-left: 0;
}

.box-34 .ui.hot ul li {}

.box-34 .ui.hot ul li a {
    display: block;
    color: #333;
    padding: 5px 0;
}

.box-34 .ui.hot ul li a:before {
    content: "\f105";
    font: normal normal normal 14px/1 FontAwesome;
    padding-right: 8px;
}

.box-34 .left img {
    width: 100%;
    height: auto;
}

.box-34 .left .item-box {
    margin-bottom: 30px;
}

.box-34 .left .item-box .ui.segment {
    padding: 0;
    border: none;
    box-shadow: none;
}

/*box-34 e*/

/*box-35 s*/
.box-35 {}

.box-35 .header {
    color: #fff;
    line-height: 2.8;
    font-weight: bold;
    padding: 0 1rem;
    background: #f06292;
}

.box-35 .ui.grid .star {
    color: orange;
    margin-bottom: 5px;
}

.box-35 .ui.grid .tag {
    margin-bottom: 5px;
}

.box-35 .ui.grid .tag span {
    color: #fff;
    padding: 2px 5px;
    background: #f00;
}

/*box-35 e*/

/*box-36 s*/
.box-36 {}

.box-36 .left .box-28 .right .header {
    display: block;
    color: #333;
    margin-bottom: 10px;
}

.box-36 .left .box-28 .right .author {
    margin-bottom: 5px;
}

.box-36 .left .box-28 .right .author span + span {
    margin-left: 10px;
}

.box-36 .left .box-28 .right .star-box {
    color: orange;
}

.box-36 .right .ui.banner img {
    width: 100%;
    height: auto;
}

.box-34 .ui.blog ul {
    list-style: none;
    padding-left: 0;
}

.box-34 .ui.blog ul li + li {
    border-top: 1px solid #ddd;
}

.box-34 .ui.blog ul li a {
    display: block;
    color: #333;
    padding: 5px 0;
}

/*box-36 e*/

/*box-37 s*/
.box-37 {}

.box-37 .ui.grid .ui.button {
    display: block;
}

/*box-37 e*/

/*box-38 s*/
.box-38 {}

.box-38 .content img {
    width: 100%;
    height: auto;
}

/*box-38 e*/

/*box-39 s*/
.box-39 {}

.box-39 .ui.table tbody > tr:first-child td {
    text-align: center;
    font-weight: bold;
    background: #ddd;
}

.box-39 .ui.table tbody > tr:nth-of-type(2) td {
    text-align: center;
    font-weight: bold;
}

.box-39 .ui.table tbody > tr:nth-of-type(2) td > a {
    color: #f06292;
}

/*box-39 e*/

/*box-40 s*/
.box-40 {}

.box-40 .header {
    text-align: center;
    margin-bottom: 15px;
}

.box-40 .header .countdown-box {
    font-size: 16px;
    padding: 6px 0;
}

/*box-40 e*/

/*footer s*/

footer {
    padding: 3rem 0;
    background-color: #f06292;
}

footer .ui.container {
    margin-bottom: 0;
}

footer .ui.items .item .ui.image > span {
    display: inline-block;
    width: 60px;
    height: 60px;
    text-align: center;
    line-height: 60px;
    color: #333;
    font-size: 2rem;
    border-radius: 100%;
    background: #fff;
}

footer .ui.items .item .content .header {
    margin-bottom: .75rem;
}

footer .ui.items .item .content .header,
footer .ui.items .item .content .description {
    color: #fff;
}

footer .top .right .description > a {
    display: inline-block;
    color: #fff;
    margin-right: 1rem;
}

footer .bottom {
    margin-bottom: 1.5rem !important;
}

footer .bottom > p {
    text-align: center;
}

footer .bottom > p > a {
    display: inline-block;
    color: #fff;
    margin: 0 .75rem;
}

footer .copyright {
    width: 100%;
    text-align: center;
    color: #fff;
    font-size: 1.2rem;
}

/*footer e*/

/* ========== custom e ========== */

/* ========== responsive s ========== */

@media (max-width: 1199px) {
    .ui.container {
        /*width: 1200px;*/
        /*margin-left: auto !important;*/
        /*margin-right: auto !important;*/
    }

    header .column:nth-of-type(1) p:nth-of-type(2) {
        text-align: left;
    }

    header .column:nth-of-type(1) img,
    header .column:nth-of-type(2) img,
    header .column:nth-of-type(4) img {
        width: 100%;
        height: auto;
    }

    header .header-01 {
        width: calc(100% / 2);
        float: left;
        order: 2;
    }

    header .header-02 {
        width: calc(100% / 2);
        float: left;
        order: 3;
    }

    header .header-03 {
        width: calc(100% / 1);
        float: left;
        order: 1;
    }

    header .header-03 {
        text-align: center;
        margin-bottom: 10px;
    }

    header .header-03 .pic-box {
        margin-bottom: 0;
    }

    header .header-03 .pic-box img {
        width: auto;
        height: 100%;
    }

    .box-24 .content .img-list {
        min-height: 400px;
        margin: 30px 0;
    }

    .box-24 .content .img-list .title {
        padding: 15px 0 0 30px;
    }

    .box-24 .content .img-list .img-box {
        left: 180px;
    }

    .box-24 .content .img-list .img-box img {
        max-width: 250px;
        max-height: 180px;
    }
}

@media (max-width: 991px) {

    header .column:nth-of-type(1) {
        padding-bottom: 0 !important;
    }

    header .column:nth-of-type(1) p:nth-of-type(2) {
        text-align: center;
    }

    header .column:nth-of-type(1) img {
        width: auto;
        height: 100%;
    }

    header .ui.container {
        margin-bottom: 0;
    }

    header .column:nth-of-type(1) {
        left: 0;
    }

    header .column:nth-of-type(1) p:first-child {
        margin-bottom: 0;
    }

    header .column:nth-of-type(2) {
        right: 0;
    }

    header .column:nth-of-type(3) {
        right: 0;
    }

    .box-03 .ui.card .content .header {
        font-size: 1rem;
        /*font-weight: normal;*/
    }

    .box-03 .ui.card .content .meta .price {
        font-size: 1.2rem;
        /*font-weight: normal;*/
    }

    .box-05 .ui.grid .row .column {
        text-align: center;
        margin-bottom: 1rem;
    }

    .pic-list:nth-of-type(odd) .pic-box {
        padding-top: 68px;
    }

    .pic-list:nth-of-type(even) .pic-box {
        padding-bottom: 68px;
    }

    .pic-list .title p:nth-of-type(1) {
        width: 100%;
        height: auto;
        text-align: left;
        line-height: 1.5;
        margin-right: 0;
        border-radius: 0;
        background: transparent;
    }

    .pic-list .title p:nth-of-type(2) {
        padding-top: 0;
    }

    .pic-list .title p:nth-of-type(2) span {
        display: block;
        font-size: 1.2rem;
        font-weight: bold;
    }

    .box-12 .slick-dots {
        margin-bottom: 30px;
    }

    .box-12 .slick-dots li {
        width: 20px !important;
        height: 20px !important;
        float: none !important;
        margin: 0 5px !important;
        padding: 0 !important;
        cursor: pointer;
    }

    .box-12 .slick-dots li button:before {
        display: block;
    }

    .box-12 .slick-dots li button.thumbnail img {
        display: none;
    }

    .box-12 .slick-dots li button {
        width: 20px;
        height: 20px;
        padding: 5px;
    }

    .box-24 .content .img-list {
        min-height: 240px;
        margin: 30px 0;
    }

    .box-24 .content .img-list .title {
        padding: 15px 0 0 30px;
    }

    .box-24 .content .img-list .img-box {
        left: 180px;
    }

    .box-24 .content .img-list .img-box img {
        max-width: 160px;
        max-height: 140px;
    }

    .box-24 .content .img-list .img-box .image:nth-of-type(1) img,
    .box-24 .content .img-list .img-box .image:nth-of-type(4) img {
        max-height: 100px;
    }

    .box-24 .content .img-list .img-box .image:nth-of-type(3) img,
    .box-24 .content .img-list .img-box .image:nth-of-type(6) img {
        max-height: 80px;
    }

    .box-30 .ui.grid .column {
        width: 33.33333% !important;
    }

}

@media (max-width: 767px) {
    .pc-img {
        display: block;
    }

    .tablet-img {
        display: none;
        width: 100%;
        height: auto;
    }

    .header-bar {
        display: none;
    }

    header {
        padding-top: 1rem;
    }

    header .column:nth-of-type(1) p:nth-of-type(2) {
        text-align: center;
    }

    header .column:nth-of-type(1) {
        left: 0;
    }

    header .column:nth-of-type(1) p:first-child {
        margin-bottom: 0;
    }

    header .column:nth-of-type(2) {
        right: 0;
    }

    header .column:nth-of-type(3) {
        right: 0;
    }

    .box-02 .ui.horizontal.list {
        width: 100%;
        float: left;
    }

    .box-02 .ui.segment > .item {
        margin-bottom: 1rem;
    }

    .box-02 .ui.list .list > span.item {
        display: block;
    }

    .box-02 .ui.list .list > a.item {
        width: 45%;
        float: left;
        line-height: 2.5;
        border-bottom: 1px solid #ddd;
    }

    .box-02 .ui.horizontal.list > .item,
    .box-02 .ui.horizontal.list > .item:first-child,
    .box-02 .ui.horizontal.list > .item:last-child {
        padding-top: 0;
        padding-bottom: 0;
    }

    .box-11 .left {
        right: 0;
    }

    .box-11 .right {
        left: 0;
    }

    .box-14 .sixteen.wide.mobile,
    .box-16 .sixteen.wide.mobile,
    .box-18 .sixteen.wide.mobile {
        width: 50% !important;
    }

    .box-15 .ui.items > .item {
        margin: 1em 0 !important;
    }

    .box-17 > .content.video {
        text-align: center;
        margin: 0;
    }

    .box-18 .ui.items > .item:first-child {
        margin-top: 0em !important;
    }

    footer {
        padding: 1.5rem 0;
        background-color: #f06292;
    }

    footer .top .left .ui.image {
        margin-left: 0 !important;
    }

}

@media (max-width: 479px) {
    header .header-01,
    header .header-02,
    header .header-03 {
        width: 100%;
    }

    header .header-01 {
        text-align: center;
    }

    header .header-01 .main-logo {
        display: inline-block;
    }

    header .header-02 {
        display: none;
    }

    header .header-03 .pic-box img {
        width: 100%;
        height: auto;
    }

    .pc-img {
        display: none;
    }

    .tablet-img {
        display: block;
        width: 100%;
        height: auto;
    }

    header .column:nth-of-type(1) p:first-child {
        margin-bottom: 0;
    }

    header .column:nth-of-type(1) p:nth-of-type(2) {
        text-align: left;
    }

    header .column:nth-of-type(1) p:first-child > img {
        width: 100%;
        height: auto;
    }

    nav .menu-grid > .item {
        width: calc(100% / 3) !important;
    }

    nav .menu-grid > .item.column:nth-of-type(1):after,
    nav .menu-grid > .item.column:nth-of-type(2):after,
    nav .menu-grid > .item.column:nth-of-type(3):after {
        position: absolute;
        content: '';
        bottom: 0;
        left: 0;
        width: 100%;
        height: 1px;
        background: rgba(34, 36, 38, 0.1);
    }

    nav .menu-grid > a.item:after {
        display: none;
    }

    nav .menu-grid .item:after {
        /*position: absolute;*/
        /*content: '';*/
        /*bottom: 0;*/
        /*left: 0;*/
        /*width: 100%;*/
        /*height: 1px;*/
        /*background: rgba(34, 36, 38, 0.1);*/
    }

    .box-03 .ui.grid .row .column:first-child {
        /*padding-top: 1rem;*/
        padding-bottom: 2rem;
    }

    .box-03 .ui.grid .column {
        width: 100% !important;
    }

    .box-04 .ui.grid .item.column,
    .box-06 .ui.grid .item.column,
    .box-07 .ui.grid .item.column {
        width: 50% !important;
        margin: 0;
    }

    .box-14 .sixteen.wide.mobile,
    .box-16 .sixteen.wide.mobile,
    .box-18 .sixteen.wide.mobile {
        width: 100% !important;
    }

    .box-14 .style-04 > .column {
        width: 100% !important;
    }

    .box-15 .ui.column > .item.column {
        width: 100% !important;
    }

    .box-19 .ui.column > .column {
        width: 50% !important;
    }

    .ui.items .item {
        margin-bottom: 1rem !important;
    }

    .box-24 .content .img-list {
        position: relative;
        min-height: 400px;
        overflow: hidden;
        margin: 20px 0;
    }

    .box-24 .content .img-list .title {
        position: relative;
        top: 0;
        left: 0;
        -webkit-transform: inherit;
        -moz-transform: inherit;
        -ms-transform: inherit;
        -o-transform: inherit;
        transform: inherit;

        width: 100%;
        height: 100px;
        text-align: center;
        padding: 12px 0 0 0;
        margin-bottom: 20px;
        background: #f5f5f5;
    }

    .box-24 .content .img-list .img-box {
        position: relative;
        top: 0;
        left: 0;
        -webkit-transform: inherit;
        -moz-transform: inherit;
        -ms-transform: inherit;
        -o-transform: inherit;
        transform: inherit;
    }

    .box-24 .content .img-list .img-box .image {
        display: inline-block;
    }

    .box-24 .content .img-list .img-box img {
        width: auto;
        height: auto;
        max-height: 300px;
    }

    .box-24 .content .img-list .img-box .image:nth-of-type(1) img,
    .box-24 .content .img-list .img-box .image:nth-of-type(4) img {
        max-height: inherit;
    }

    .box-24 .content .img-list .img-box .image:nth-of-type(3) img,
    .box-24 .content .img-list .img-box .image:nth-of-type(6) img {
        max-height: inherit;
    }

    .box-24 .content .img-list .img-box .image:nth-of-type(1) {
        margin-left: 0;
    }

    .box-24 .content .img-list .img-box .image:nth-of-type(4),
    .box-24 .content .img-list .img-box .image:nth-of-type(6) {
        vertical-align: top;
    }

    .box-30 .ui.grid .column {
        width: 50% !important;
    }

    .box-31 .ui.grid .column {
        width: 100% !important;
    }

}

@media (max-width: 319px) {
}

/* ========== responsive e ========== */

/* ========== responsive s ========== */

/*Extra small devices (portrait phones, less than 576px)
No media query for `xs` since this is the default*/

@media (min-width: 576px) {
    /*Small devices (landscape phones, 576px and up)*/
}

@media (min-width: 768px) {
    /*Medium devices (tablets, 768px and up)*/
}

@media (min-width: 992px) {
    /*Large devices (desktops, 992px and up)*/
}

@media (min-width: 1200px) {
    /*Extra large devices (large desktops, 1200px and up)*/
}

/* ========== responsive e ========== */