/*
Theme Name: Newstack
Theme URI: https://themeansar.com/free-themes/newstack-free-blog-magazine-elementor-wordpress-theme/
Author: Themeansar
Author URI: https://themeansar.com
Description: Newstack is a fast, clean, modern-looking Best Responsive News Magazine WordPress theme. The theme is fully widgetized, so users can manage the content by using easy to use widgets. Newstack is suitable for dynamic news, newspapers, magazine, publishers, blogs, editors, online and gaming magazines, newsportals,personal blogs, newspaper, publishing or review siteand any creative website. Newstack is SEO friendly, WPML,Gutenberg, translation and RTL ready. Live preview : https://newsup.themeansar.com/newstack/ and documentation at https://docs.themeansar.com/docs/newsup/
Version: 2.7
Requires PHP: 7.4
Requires at least: 6.6
Tested up to: 7.0
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Template: newsup
Text Domain: newstack
Tags: blog, portfolio, news, grid-Layout, one-column, two-columns, three-columns, flexible-header, left-sidebar, right-sidebar, custom-background, custom-colors, custom-logo, custom-menu, featured-images, footer-widgets, full-width-template, post-formats, rtl-language-support, theme-options, sticky-post, threaded-comments, translation-ready, block-styles, wide-blocks

Newstack WordPress Theme is child theme of Newsup, Copyright 2020 Themeansar
Newstack is distributed under the terms of the GNU General Public License v3

Newstack is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.
*/
:root{
	--bodyFont: 'Inter', sans-serif;
	--headFont: "Poppins", sans-serif;
}
a:focus {
    outline: 1px solid;
}

span.time {
    margin-left: 5px;
    padding: 2px 4px;
    border-radius: 2px;
    font-size: 14px;
    font-weight: 600;
    line-height: 35px;
}
.mg-social li span.icon-soci { 
    float: inherit;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}
.mg-headwidget.center .heacent {
    margin-top: unset !important;
}
.mg-headwidget.center .logo-center, .mg-headwidget.center .navbar-header, .mg-headwidget.center .site-branding-text  {
    float: none;
    text-align: center;
}

.mg-headwidget.center .navbar-brand {
    float: none;
    display: inline-block;
    margin: 8px auto 0 auto;
    font-weight: bold;
}
.mg-headwidget.center .heacent {
    margin-top: 40px;
    color: #fff;
}
.navbar-wp .dropdown-menu.searchinner .btn {
    border: medium none;
    border-radius: 0 4px 4px 0;
    height: 40px;
    line-height: 25px;
    padding: 5px 15px;
}
.mg-search-box .dropdown-toggle::after {
	display: none;
}
.m-header {
	display: none;
}
.desk-header {
	display: flex;
}
.mobilehomebtn {
    width: 30px;
    text-align: center;
    line-height: 30px;
    height: 30px;
}
.logo-auto {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
.mg-blog-post.md{
	width: 49.8%;
	float: left;
	height: 236px;
}
.mg-blog-post.md .bottom h4 {
    font-size: 26px;
}
.mb1px {
	margin-bottom: 1px;
}
.mg-blog-post.lg.mins {
	width: 100%;
	height: 222.5px;
	margin-bottom: 30px;
}
.mg-blog-post.lg.mins h4.title {
	font-size: 22px;
}
footer .site-description {
    letter-spacing: 1.2px; 
}
.mg-headwidget .site-branding-text .text-center {
    color: #fff;
    text-align: center;
}
.woocommerce div.product div.images .woocommerce-product-gallery__wrapper { 
    box-shadow: 0 1px 3px rgb(0 0 0 / 15%);
}
.mg-social.info-right a:focus{
    outline: none;
}
.mg-nav-widget-area .navbar-brand{
    margin-right: 0;
}
.comment-detail .edit-link a, 
.comment-detail .reply a, 
pre.wp-block-code a {
    text-decoration: underline;
}
.mg-latest-news .mg-latest-news-slider{
    left: 185px;
}
div.mg-latest-news .bn_title span {
    border: none;
    top: unset;
    right: unset;
}
.wp-block-search .wp-block-search__label, .mg-widget .wp-block-group h2, .mg-sidebar .mg-widget .wtitle, .mg-sec-title h4, footer .mg-widget h6{
    padding-right: 15px;
}
:is(.wp-block-search .wp-block-search__label, .mg-widget .wp-block-group h2, .mg-sidebar .mg-widget .wtitle, .mg-sec-title h4, footer .mg-widget h6)::before{
    display: none;
}
.mg-blog-category a{
    text-transform: capitalize;
    padding: 5px 10px;
    border-radius: 0;
    font-size: 12px;
    font-weight: 500;
    line-height: 1;
}
.mg-sidebar .mg-widget .wtitle{
    font-weight: 700;
}
.mg-posts-modul-6 .mg-sec-top-post .title{
    font-size: 24px;
    line-height: 1.5;
}
.mg-posts-sec-inner .mg-posts-sec-post, .mg-sidebar .mg-widget{
    box-shadow: 0 0 8px 2px rgba(23, 23, 35, 0.05);
    border-radius: 0;
    border: none;
}
.mg-sidebar .mg-widget.widget_search:not(:has(.wp-block-search__button-outside)){
    padding-top: 0;
}
.wp-block-search.wp-block-search__button-only .wp-block-search__button{
    align-items: center;
}
.widget_search:has(.wp-block-search.wp-block-search__button-only.wp-block-search__searchfield-hidden){
    padding-left: 0;
    padding-right: 0;
}
.widget_search:has(.wp-block-search.wp-block-search__button-only.wp-block-search__searchfield-hidden) .wp-block-search__label{
    margin-left: 0;
}
.mg-posts-modul-6 .mg-post-thumb{
    margin-right: -5px;
}
.mg-tpt-tag-area, .mg-latest-news-sec{
    margin-top: 20px;
    padding: 0;
}
.mg-tpt-tag-area .mg-tpt-txnlst{
    padding: 2px 5px;
}
.mg-latest-news-sec{
    box-shadow: none;
}
.mg-latest-news-sec .mg-latest-news{
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.07);
}

/* Animation */
.mg-latest-news .bn_title .title {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding-right: 8px;
}
/* The icon */
.bn_title .title::before {
    content: "\e0b7";   /* Font Awesome unicode */
    font-family: "Font Awesome 6 Free"; /* Or your FA font */
    font-weight: 900;
    font-size: 16px;
    position: relative;
    z-index: 2;
}
/* Ripple animation container (behind icon) */
.bn_title .title::after {
    content: "";
    position: absolute;
    left: 26px;       /* adjust position relative to icon */
    top: 50%;
    transform: translateY(-50%) translateX(0);
    width: 35px;
    height: 35px;
    border: 2px solid #fff;
    border-radius: 50%;
    opacity: 0;
    animation: zoom 2s linear infinite;
    z-index: 1;
}
/* Additional ripples */
.bn_title .title span::before,
.bn_title .title span::after {
    content: "";
    position: absolute;
    right: -41px;
    top: 50%;
    transform: translateY(-50%);
    width: 35px;
    height: 35px;
    border: 2px solid #fff;
    border-radius: 50%;
    opacity: 0;
    z-index: 1;
}
.screen-reader-text:focus {
    background-color: #f1f1f1;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip: auto !important;
    clip-path: none;
    color: #21759b;
    display: block;
    font-size: 0.875rem;
    font-weight: 700;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
}

.bn_title .title span::before {
    animation: zoom 2s linear 0.5s infinite;
}

.bn_title .title span::after {
    animation: zoom 2s linear 1s infinite;
}
@keyframes zoom {
    0% {
        transform: translate(-50%, -50%) scale(0.2);
        opacity: 0;
    }
    50% {
        opacity: 0.9;
    }
    100% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0;
    }
}

/* ============================================= Responsive Part ======================================== */

@media (min-width: 1200px) {
    .mg-blog-post.md .bottom h4 {
        max-height: 65px;
        overflow: hidden;
    }
}
@media (max-width: 991px) {
	.navbar-wp .navbar-nav > li> a i {
    	display: none;
	}	
    #menu-primary li.active.home {
        display: none;
    }
    .m-header {
        width: 100%;
        padding-right: 15px;
        padding-left: 15px;
        display: flex;
        justify-content: space-between;
    }
    .desk-header {
        display: none;
    }
}
@media (max-width: 767px) and (min-width: 576px) {
    .mg-fea-area .col-md-3 {
        display: flex;
    }
    .mg-fea-area .mg-blog-post.lg.mins {
        margin: 0 5px 30px 0;
    }
    .mg-fea-area .col-md-3.top-right-area{
        display: block;
    }
}
@media screen and (max-width: 767px) and (min-width: 240px) {
    .mg-headwidget .navbar-wp .navbar-nav > li> a {
        position: relative;
        border-bottom: 1px solid rgba(225,225,225,0.4);
    }
}
@media (min-width: 240px) and (max-width: 576px){
    .mg-fea-area .mg-blog-post.lg.mins,.mg-fea-area  .mg-posts-sec {
        margin-bottom:20px;
    }

    .mg-fea-area .mr-bot60 {
        margin-bottom: 50px;
    }
}

/* --------------------------------------
=========================================
	PLUS AREA
=========================================
-----------------------------------------*/

body {
    font-family: "Noto Sans JP", sans-serif !important;
    font-optical-sizing: auto;
    font-style: normal;
    font-size: 16px !important;
}

.product-subset__table th {
    background-color: #EEE;
    border: 1px solid #AAA;
    padding: 10px;
    font-size: 16px;
    vertical-align: middle;
}

.product-subset__table td {
    border: 1px solid #AAA;
    font-size: 16px;
    padding: 10px;
    vertical-align: middle;
}

.product-subset__price br {
    display: none;
}

.product-subset__price {
    color: #d21a1a;
    font-weight: bold;
    font-size: 1.4em;
}

.product-subset__price--yen {
    font-size: 60%;
    font-weight: bold;
}

td.product-subset__td-order br {
    display: none;
}

.product-subset__submit-button {
    width: 100%;
    font-size: 1.1em;
    font-weight: bold;
    border-radius: 8px;
    padding: 10px;
}

.inyou {
    position: relative;
    padding: 0;
    border: 1px solid #AAA;
    margin-bottom: 30px;
}

.inyou p {
    margin: 0 !important;
    /* position: absolute; */
    padding: 10px;
    line-height: 2;
    top: 3px;
    left: 10px;
    background: #eeeeee;
    border-radius: 0;
    font-weight: bold;
    color: #333;
}

.inyou ul {
    padding: 20px;
    border-top: 1px solid #AAA;
    margin-bottom: 0 !important;
}

.inyou ul li {
    list-style: none;
    margin-bottom: 10px;
    font-size: 16px;
}

.inyou ul li:last-child {
    margin: 0;
}
table.about th {
    border: 1px solid #AAA;
    width: 200px;
    padding: 10px;
    font-size: 1em;
    background-color: #EEE;
}

table.about td {
    border: 1px solid #AAA;
    padding: 10px;
    font-size: 1em;
}

.page-entry-title-box h1 {
    font-size: 30px;
}

.bs-blog-post.single img {
    margin-bottom: 20px;
}

p.tel_number:before {
    content: "\f095";
    font-family: 'FontAwesome';
    margin-right: 10px;
}

p.address:before {
    content: "\f041";
    font-family: 'FontAwesome';
    margin-right: 12px;
}

.textwidget.custom-html-widget p {
    font-weight: bold;
    font-size: 18px;
}

p.product-price {
    color: #d21a1a;
    font-weight: bold;
    font-size: 1.2em;
    margin-bottom: 10px;
    text-align: left !important;
    margin-bottom: 20px;
}

h2.entry-title {
    text-align: left;
}

.blog-post {
    border: 2px solid #DDD;
    border-radius: 8px;
    padding: 15px;
    box-sizing: border-box;
}

article .blog-post .image {
    width: 100%;
    max-width: 400px;
    margin: 0 auto!important;
}

h3.widget-title {border-bottom: 2px solid #333;padding: 0 10px 10px;}

.single.single-left-sidebar #comments, .single.single-left-sidebar .content, .single.single-left-sidebar div.title, .single.single-right-sidebar #comments, .single.single-right-sidebar .content, .single.single-right-sidebar div.title {
    width: 100% !important;
}

h1.entry-title {
    border-bottom: 2px dotted #CCC;
    padding: 10px 0 20px;
}

.copyrights span {
    display: none;
}

.hd-bar .side-menu ul li a {
    font-size: 16px;
}

p.btn_detail {
    width: 100%;
    text-align: center;
}

p.btn_detail a {
    border: 1px solid #AAA;
    background-color: #fd0707;
    padding: 10px 20px;
    border-radius: 10px;
    color: #FFF;
    text-decoration: none;
    width: 100%;
    display: block;
    margin: 0 auto;
    font-size: 1.1em;
}

p.btn_detail a:hover {
    opacity: 0.8;
}

.bs-blog-post .bs-blog-thumb img {
    border-radius: 0;
    border-bottom: none;
    max-width: 500px;
    margin: 0 auto;
    width: 100%;
}

.reviewList ul li {
    list-style: none;
    margin-bottom: 20px;
    border: 4px solid #EEE;
    padding: 20px !important;
}

.reviewList ul li p {
    margin: 0;
}

p.review_text {
    margin-bottom: 0;
}

p.review_star i {margin-right: 2px;color: #ffa400;}

.entry-content h2 {
    font-size: 1.5em !important;
    border-bottom: 4px dotted #6adc64;
    padding: 0 10px 10px;
}

dl.faq_area {
    border: 2px solid #DDDD;
    padding: 10px 20px 20px !important;
    margin-bottom: 20px !important;
    border-radius: 10px;
}

dl.faq_area dt:before {
    content: "Q.";
    color: #d51a1a;
    font-size: 30px;
    margin-right: 7px;
}

dl.faq_area dt {
    margin: 0 0 10px;
    border-bottom: 1px dotted #CCC;
    padding-bottom: 10px;
    line-height: 2;
}

dl.faq_area dd {
    margin: 0;
    line-height: 2;
}

dl.faq_area dd:before {
    content: "A.";
    font-weight: bold;
    font-size: 30px;
    color: #1a7dd5;
    margin-right: 7px;
}

ul.bta_area li {
    list-style: none;
    padding: 5px 0;
}

ul.bta_area {
    margin: 0 !important;
    padding: 0 !important;
}

.site-title {
    margin-top: 0 !important;
    font-size: 30px !important;
}

.single-entry-summary h2 {
    font-size: 1.5em;
    border-bottom: 2px solid #fd0707;
    padding: 0 10px 10px;
    margin-bottom: 20px;
}

table.product-subset__table {
    margin: 0 0 30px;
}

table.point th {
    background-color: #d8effe;
    border: 1px solid #AAA;
    padding: 10px;
    width: 180px;
    text-align: left;
}

table.point td {
    border: 1px solid #AAA;
    padding: 10px;
}

ul.review li {
    border: 4px solid #DDD;
    border-radius: 10px;
    margin: 0 0 20px;
    padding: 20px !important;
    list-style: none;
}

ul.review {
    margin: 0 !important;
    padding: 0;
}

table.point {
    margin-bottom: 30px;
}

p.review_name {
    font-weight: bold;
    font-size: 1.1em;
}

.news-thumb img {
    width: 100%;
    max-width: 400px;
    margin: 0 auto 20px;
    display: table;
}

table.contact th {
    background-color: #EEE;
    border: 1px solid #AAA;
    padding: 10px;
    width: 200px;
}

table.contact td {
    background-color: #FFF;
    border: 1px solid #AAA;
    padding: 10px;
}

table.contact {
    margin-bottom: 20px;
}

.entry-content dl dt {
    font-weight: bold;
    line-height: 2;
}

.entry-content dl dd {
    padding: 20px;
    margin: 0 0 20px;
}

nav.navigation.post-navigation {
    display: none;
}

ul.review p {
    margin: 0!important;
}

.box {
    border: 1px solid #AAA;
    padding: 10px;
    background-color: #f3f3f3;
    padding: 20px;
    border-radius: 8px;
}

.box p {
    margin: 0;
}

.box h2 {
    margin: 0 0 20px;
}

ul.kanren {
    display: flex;
    flex-flow: row wrap;
    margin: 0 !important;
    padding: 0 !important;
}

ul.kanren li {
    width: 25%;
    list-style: none;
    padding: 10px !important;
    box-sizing: border-box;
}

ul.kanren li a {
    border: 1px solid #AAA;
    padding: 10px;
    border-radius: 10px;
    display: block;
    text-decoration: none;
    box-shadow: 0 0 5px #CCC;
}

.kanren li p {
    text-align: center;
    text-decoration: none;
    color: #333;
    font-weight: bold;
    font-size: 16px;
    margin: 10px 0 0!important;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

ul.kanren li a:hover {
    opacity: 0.8;
}

form.product-subset__form button {
    width: 100%;
    text-align: left;
    border: 2px solid #257319;
    background-color: #6adc64;
    font-size: 18px;
    border-radius: 4px;
    appearance: none;
    line-height: 1.5;
    margin-bottom: 10px;
    font-weight: 700;
    position: relative;
    cursor: pointer;
    padding: 16px;
    box-shadow: 0 0 5px #CCC;
    margin: 0;
    color: #FFF;
}

.single form.product-subset__form button {
    margin: 0;
}

form.product-subset__form button span {
    font-size: 80%;
    padding: 5px 0 0 10px;
    color: #EEE;
}

form.product-subset__form button:after {
    content: "\f105";
    font-family: 'FontAwesome';
    position: absolute;
    top: 50%;
    right: 10px; /* Ã¦Â¨ÂªÃ£â€šâ€šÃ¤Â¸Â­Ã¥Â¤Â®Ã£ÂÂ«Ã£Ââ€”Ã£ÂÅ¸Ã£Ââ€žÃ¥Â Â´Ã¥ÂË† */
    transform: translate(-50%, -50%);
}

.single form.product-subset__form {
    margin-bottom: 30px;
}

form.product-subset__form {
    margin-bottom: 0;
}

form.product-subset__form br {
    display: none;
}

table.guide th {
    width: 180px;
    border: 1px solid #AAA;
    background-color: #EEE;
    padding: 10px;
    text-align: left;
}

table.guide td {
    border: 1px solid #AAA;
    background-color: #FFF;
    padding: 10px;
    text-align: left;
}

body {
  counter-reset: faq-counter;
} 
/* Ã¥Ââ€ž faq_area Ã£ÂÂ® dt Ã£ÂÅ’Ã§â€¢ÂªÃ¥ÂÂ·Ã£â€šâ€™Ã¥Â¢â€”Ã£â€šâ€žÃ£Ââ„¢ */
.faq_area dt {
  counter-increment: faq-counter;
}
/* dt Ã£ÂÂ« QÃ¢â€”Â¯ Ã£â€šâ€™Ã¤Â»ËœÃ¤Â¸Å½ */
.faq_area dt::before {
  content: "Q" counter(faq-counter) "."!important;
  font-weight: bold;
}

.bs-blog-post .small h2 {
    font-weight: 600;
    font-size: 22px;
    border-bottom: 4px dotted #ff3366;
    padding: 10px;
	margin-bottom:20px;
}

p.category_lavel a {
    background-color: #333333;
    display: inline-block;
    color: #FFF;
    text-decoration: none;
    padding: 2px 8px;
    border-radius: 40px;
    font-size: 12px;
}

.bs-blog-thumb.lg figure img {
    border-bottom: 1px solid #CCC;
}

ol.breadcrumb {
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
}

ol.breadcrumb::-webkit-scrollbar {
    height: 0;
}

figure.post-thumbnail img {
    width: 100%;
    max-width: 400px;
    margin: 0 auto;
}

.entry-header h2 {
    border-bottom: 2px dotted #05479b;
    padding: 10px 0 10px;
    margin-bottom: 40px !important;
    font-size: 30px;
    font-size: 1.8rem !important;
}

.custom-html-widget li a,.widget ul.menu li.menu-item a {
    border-bottom: 1px dotted #AAA;
    display: block;
    line-height: 2;
    padding: 5px 0;
    color: #6adc64 !important;
    font-weight:normal;
}

.custom-html-widget li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.custom-html-widget ul {
    margin: 0;
    padding: 0;
}

.custom-html-widget li a:hover,.widget ul.menu li.menu-item a:hover {
    background-color: #EEE;
	text-decoration:none!important;
}

.container-full h1.title {
    font-size: 1.6rem;
    padding: 0;
    border-left: 5px solid #05479b;
    padding: 4px 0 4px 10px;
    margin: 10px 0 20px;
}

label {
  cursor: pointer;
  user-select: none;
}

.product-subset__form ul li {
    list-style: none;
    display: flex;
    border: 2px solid #d0d0d0;
    padding: 10px !important;
    border-radius: 10px;
    margin-bottom: 10px;
    line-height: 2;
    align-items: center;
    background-color: #EEE;
}

.product-subset__form ul {
    padding: 0 !important;
    margin: 0 !important;
}

form.product-subset__form ul li input {
    position: relative;
    border-color: #333 !important;
    background-color: #FFF !important;
}

.product-subset__form button {
    font-size: 18px;
    padding: 16px 32px;
    border-radius: 8px;
    margin: 0 0 0 auto;
    display: table;
    appearance: none;
    cursor: pointer;
    height: auto;
    background-color: #65991f;
    color: #FFF;
}

.product-subset__form ul li label {
    flex: 1;
    font-weight: bold;
    font-size: 20px;
}

.select-wrapper-1 select {
    width: 100%;
    padding: 10px 30px 10px 10px;
    font-size: 20px;
    font-weight: bold;
    position:relative;
    border-radius: 4px;
    appearance: none;
    border: 1px solid #333;
    border-radius: 4px;
    appearance: none;
    background: #fff;
    outline: none;
    cursor: pointer;
    line-height: 2;
}

.select-wrapper-1 {
    margin-bottom: 10px;
    position: relative;
}

.select-wrapper-1::after {
  content: "\f0d7"; /* Font Awesome 4.7 ä¸‹å‘ãçŸ¢å° */
  font-family: FontAwesome;
  position: absolute;
  right: 10px; /* ãƒœã‚¿ãƒ³ã®å¹…ã«åˆã‚ã›ã¦èª¿æ•´ */
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  color: #333;
  font-size: 16px;
}

.select-wrapper-2 {
    display: flex;
    position:relative;
    width: 100%;
    max-width: 360px;
    margin: 0 0 0 auto;
    }


.select-wrapper-2 select {
    margin-right: 10px;
    font-size: 20px;
    border-radius: 4px;
    border: 1px solid #333;
    outline: none;
    font-weight: bold;
    cursor: pointer;
    appearance: none;
    padding: 10px 30px 10px 10px;
    position:relative;
    width: 80px !important;
    height: auto;
    min-width: initial;
}

.select-wrapper-2::after {
  content: "\f0d7"; /* Font Awesome 4.7 Ã¤Â¸â€¹Ã¥Ââ€˜Ã£ÂÂÃ§Å¸Â¢Ã¥ÂÂ° */
  font-family: FontAwesome;
  position: absolute;
  left: 60px; /* Ã£Æ’Å“Ã£â€šÂ¿Ã£Æ’Â³Ã£ÂÂ®Ã¥Â¹â€¦Ã£ÂÂ«Ã¥ÂË†Ã£â€šÂÃ£Ââ€ºÃ£ÂÂ¦Ã¨ÂªÂ¿Ã¦â€¢Â´ */
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  color: #333;
  font-size: 16px;
}

.select-wrapper-2 button {
    flex: 1;
    font-weight: bold;
    font-size: 20px;
    border-radius: 4px;
    padding: 10px;
    border: 1px solid #333;
    appearance: none;
    cursor: pointer;
}

.select-wrapper-2 button:hover {
    background-color: #333;
    color: #FFF;
}

.entry-content img {
    width: 100%;
    max-width: 400px;
    margin: 0 auto 30px;
}

ul.kanren img {
    margin: 0;
}

@media (max-width: 768px) {
.product-subset__submit-button {
    font-size: 16px;
}
.product-subset__table th {
    font-size: 16px;
}
.product-subset__table td {
    font-size: 16px;
}
.product-subset__unit-price {
    font-size: 12px;
}
.bs-blog-post .small {
    padding: 10px;
}
.inyou ul {
    margin: 0 !important;
    width: 100% !important;
}

.content p {
    width: 100% !important;
    margin-bottom: 30px !important;
}

div#post-wrapper {
    padding: 0;
}
h1.entry-title {
    font-size: 24px;
}
}

@media (max-width: 480px) {
.bs-blog-post.single .bs-header .title {
	font-size: 24px!important;
	font-weight: 600;
	border-bottom: 5px double #df5488;
	padding: 0 0 10px;
	margin: 0;
}
.bs-blog-post .bs-header {
    padding: 20px 20px 10px !important;
}
.bs-headthree.six {
    margin-bottom: 0px;
}
.bs-blog-post .bs-blog-thumb img {
    max-width: 280px !important;
}
.site-branding-text .site-title a {font-size: 18px!important;}
.img-fluid {
    width: 100%;
    max-width: 240px!important;
    margin: 0 auto;
    display: table;
}
table.about tr {
    display: block;
    width: 100%;
}

table.about th {
    display: block;
    width: 100%;
    font-size: 16px;
    border: none;
    border-right: 1px solid #AAA;
    border-bottom: 1px solid #AAA;
}

table.about td {
    display: block;
    width: 100%;
    font-size: 16px;
    border: none;
    border-right: 1px solid #AAA;
    border-bottom: 1px solid #AAA;
}

table.about {
    border-top: 1px solid #AAA;
    border-left: 1px solid #AAA;
}
.page-area {
    padding: 20px 0;
}
#sidebar {
    display: block;
    max-width: 100%;
    clear: both;
}
article.blog-article {
    clear: none;
    padding-right: 0!important;
}
.col-md-9 {
    padding-right: 0 !important;
}
ul.kanren li {
    width: 100%;
}
table.point th {
    display: block;
    width: 100%;
    border: none;
    border-bottom: 1px solid #AAA;
    border-right: 1px solid #AAA;
}

table.point tr {
    display: block;
    width: 100%;
}

table.point td {
    display: block;
    width: 100%;
    border: none;
    border-bottom: 1px solid #AAA;
    border-right: 1px solid #AAA;
}

table.point {
    border-top: 1px solid #AAA;
    border-left: 1px solid #AAA;
}
.bs-header-main {
    display: none;
}

form.product-subset__form button span {
    font-size: 80%;
    padding: 0;
    color: #EEE;
    display: block;
}
.entry-header h2 {
    margin-bottom: 0 !important;
    font-size: 24px;
}
table.guide th {
    width: 120px;
}
.super_visor dl {
  margin: 0;
  display: block;
}
.entry-content h2 {
    padding: 0 0 10px;
    margin: 0 0 10px;
}
.navbar {padding: 5px 0!important;}
.site-content {
    margin-top: 20px;
}
.blog-article header {
    width: 100%;
}
.blog-article .entry-content {padding: 20px;}
.site-branding .site-title {font-size: 1.4em!important;}
}

/* --------------------------------------
=========================================
	PLUS AREA
=========================================
-----------------------------------------*/

/* ==========================================================================
   Ã¥ÂÂ£Ã£â€šÂ³Ã£Æ’Å¸Ã£â€šÂ¨Ã£Æ’ÂªÃ£â€šÂ¢Ã¥â€¦Â¨Ã¤Â½â€œÃ£ÂÂ®Ã£Æ’Â¬Ã£â€šÂ¤Ã£â€šÂ¢Ã£â€šÂ¦Ã£Æ’Ë†
   ========================================================================== */
.column_review_area_outer.review_select {
  display: flex;
  gap: 20px; /* Ã£Æ’Å“Ã£Æ’Æ’Ã£â€šÂ¯Ã£â€šÂ¹Ã©â€“â€œÃ£ÂÂ®Ã¤Â½â„¢Ã§â„¢Â½ */
  width: 100%;
  max-width: 1000px; /* Ã¥Â¿â€¦Ã¨Â¦ÂÃ£ÂÂ«Ã¥Â¿Å“Ã£ÂËœÃ£ÂÂ¦Ã¨ÂªÂ¿Ã¦â€¢Â´Ã£Ââ€”Ã£ÂÂ¦Ã£ÂÂÃ£ÂÂ Ã£Ââ€¢Ã£Ââ€ž */
  margin: 30px auto;
  padding: 0;
  box-sizing: border-box;
  background-color: #fff; /* Ã§â„¢Â½Ã£Æ’â„¢Ã£Æ’Â¼Ã£â€šÂ¹ */
}

/* Ã¥Ââ€žÃ¥ÂÂ£Ã£â€šÂ³Ã£Æ’Å¸Ã£Æ’Å“Ã£Æ’Æ’Ã£â€šÂ¯Ã£â€šÂ¹Ã¯Â¼Ë†Ã¨â€°Â¯Ã£Ââ€žÃ£Æ’Â»Ã¦â€šÂªÃ£Ââ€žÃ¥â€¦Â±Ã©â‚¬Å¡Ã¯Â¼â€° */
.column_review_area {
  flex: 1; /* 2Ã£ÂÂ¤Ã£ÂÂ®Ã£Æ’Å“Ã£Æ’Æ’Ã£â€šÂ¯Ã£â€šÂ¹Ã£â€šâ€™Ã§Â­â€°Ã¥Â¹â€¦Ã£ÂÂ§Ã¦Â¨ÂªÃ¤Â¸Â¦Ã£ÂÂ³ */
  background: #ffffff;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  padding: 20px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
  box-sizing: border-box;
}

.column_review_meta section p br {
    display: none;
}

/* ==========================================================================
   Ã£Æ’Â¡Ã£â€šÂ¿Ã¦Æ’â€¦Ã¥Â Â±Ã¯Â¼Ë†Ã£Æ’ËœÃ£Æ’Æ’Ã£Æ’â‚¬Ã£Æ’Â¼Ã£Æ’Â»Ã¨Â©â€¢Ã¤Â¾Â¡Ã¯Â¼â€°Ã£â€šÂ¨Ã£Æ’ÂªÃ£â€šÂ¢
   ========================================================================== */
.column_review_meta {
  border-bottom: 2px dotted #05479b; /* Ã£â€šÂ¢Ã£â€šÂ¯Ã£â€šÂ»Ã£Æ’Â³Ã£Æ’Ë†Ã£â€šÂ«Ã£Æ’Â©Ã£Æ’Â¼Ã£ÂÂ®Ã£Æ’Å“Ã£Æ’Â¼Ã£Æ’â‚¬Ã£Æ’Â¼ */
  padding-bottom: 10px;
  margin-bottom: 15px;
  display: flex;
  flex-flow: row wrap;
}

/* Ã£â€šÂ¿Ã£â€šÂ¤Ã£Æ’Ë†Ã£Æ’Â«Ã¯Â¼Ë†h2Ã¯Â¼â€° */
.column_review_meta h2 {
  font-size: 1.2rem !important;
  margin: 0 0 10px 0;
  color: #333333;
  padding: 0 0 10px;
  width: 100%;
}

/* Ã£â€šÂ¢Ã£â€šÂ¤Ã£â€šÂ³Ã£Æ’Â³Ã¯Â¼Ë†Ã£â€šÂ°Ã£Æ’Æ’Ã£Æ’â€°Ã£Æ’Â»Ã£Æ’ÂÃ£Æ’Æ’Ã£Æ’â€°Ã¯Â¼â€°Ã£ÂÂ®Ã©â€¦ÂÃ§Â½Â® */
.column_review_meta figure {
  margin: 0;
  font-size: 2rem;
  width: 50px;
}

/* Ã¨â€°Â¯Ã£Ââ€žÃ¥ÂÂ£Ã£â€šÂ³Ã£Æ’Å¸Ã£ÂÂ®Ã¨Â¦ÂªÃ¦Å’â€¡Ã£â€šÂ¢Ã£â€šÂ¤Ã£â€šÂ³Ã£Æ’Â³ */
.column_review_meta.good figure i {
  color: #05479b; /* Ã£â€šÂ¢Ã£â€šÂ¯Ã£â€šÂ»Ã£Æ’Â³Ã£Æ’Ë†Ã£â€šÂ«Ã£Æ’Â©Ã£Æ’Â¼ */
}

/* Ã¦â€šÂªÃ£Ââ€žÃ¥ÂÂ£Ã£â€šÂ³Ã£Æ’Å¸Ã£ÂÂ®Ã¨Â¦ÂªÃ¦Å’â€¡Ã£â€šÂ¢Ã£â€šÂ¤Ã£â€šÂ³Ã£Æ’Â³ */
.column_review_meta.bad figure i {
  color: #999999; /* Ã¨ÂÂ½Ã£ÂÂ¡Ã§Ââ‚¬Ã£Ââ€žÃ£ÂÅ¸Ã£â€šÂ°Ã£Æ’Â¬Ã£Æ’Â¼ */
}

/* Ã¦Å â€¢Ã§Â¨Â¿Ã¨â‚¬â€¦Ã£Æ’Â»Ã¨Â©â€¢Ã¤Â¾Â¡Ã£Æ’â€ Ã£â€šÂ­Ã£â€šÂ¹Ã£Æ’Ë† */
.column_review_meta section p {
  margin: 5px 0;
  font-size: 0.9rem;
  color: #666666;
}

.column_review_meta section p .bold {
  font-weight: bold;
  color: #333333;
}

/* ==========================================================================
   Ã¦ËœÅ¸Ã¨Â©â€¢Ã¤Â¾Â¡Ã¯Â¼Ë†Ã£Æ’â€¢Ã£â€šÂ©Ã£Æ’Â³Ã£Æ’Ë†Ã£â€šÂªÃ£Æ’Â¼Ã£â€šÂµÃ£Æ’Â Ã¯Â¼â€°Ã£ÂÂ®Ã¨Â£â€¦Ã©Â£Â¾
   ========================================================================== */
.column_review_meta .fa-star,
.column_review_meta .fa-star-o {
  color: #f39c12; /* Ã©Â»â€žÃ¨â€°Â²Ã§Â³Â»Ã¯Â¼Ë†Ã£â€šÂªÃ£Æ’Â¬Ã£Æ’Â³Ã£â€šÂ¸Ã¥Â¯â€žÃ£â€šÅ Ã£ÂÂ®Ã£â€šÂ´Ã£Æ’Â¼Ã£Æ’Â«Ã£Æ’â€°Ã¯Â¼â€° */
  margin-right: 2px;
}

/* ==========================================================================
   Ã¦Å“Â¬Ã¦â€“â€¡Ã£â€šÂ¨Ã£Æ’ÂªÃ£â€šÂ¢
   ========================================================================== */
.column_review_area article p {
  font-size: 0.95rem;
  line-height: 1.6;
  color: #444444;
  margin: 0;
}

/* ==========================================================================
   Ã£Æ’Â¬Ã£â€šÂ¹Ã£Æ’ÂÃ£Æ’Â³Ã£â€šÂ·Ã£Æ’â€“Ã¥Â¯Â¾Ã¥Â¿Å“Ã¯Â¼Ë†Ã§â€Â»Ã©ÂÂ¢Ã¥Â¹â€¦ 480px Ã¤Â»Â¥Ã¤Â¸â€¹Ã¯Â¼â€°
   ========================================================================== */
@media screen and (max-width: 480px) {
  .column_review_area_outer.review_select {
    flex-direction: column; /* Ã§Â¸Â¦Ã¤Â¸Â¦Ã£ÂÂ³Ã£ÂÂ«Ã¥Â¤â€°Ã¦â€ºÂ´ */
    gap: 15px;
    padding: 10px;
  }
}

/* ==========================================================================
   FAQÃ¥â€¦Â¨Ã¤Â½â€œÃ£ÂÂ®Ã£Æ’ÂªÃ£â€šÂ¹Ã£Æ’Ë†Ã£â€šÂ¹Ã£â€šÂ¿Ã£â€šÂ¤Ã£Æ’Â«
   ========================================================================== */
.faq_list {
  list-style: none; /* Ã£Æ’â€¡Ã£Æ’â€¢Ã£â€šÂ©Ã£Æ’Â«Ã£Æ’Ë†Ã£ÂÂ®Ã§Â®â€¡Ã¦ÂÂ¡Ã¦â€ºÂ¸Ã£ÂÂÃ£ÂÂ®Ã§â€šÂ¹Ã£â€šâ€™Ã¦Â¶Ë†Ã£Ââ„¢ */
  padding: 0;
  margin: 0 !important;
   /* Ã¨Â¦â€¹Ã£â€šâ€žÃ£Ââ„¢Ã£Ââ€žÃ¥Â¹â€¦Ã£ÂÂ«Ã¥Ë†Â¶Ã©â„¢ÂÃ¯Â¼Ë†Ã¥Â¿â€¦Ã¨Â¦ÂÃ£ÂÂ«Ã¥Â¿Å“Ã£ÂËœÃ£ÂÂ¦Ã¥Â¤â€°Ã¦â€ºÂ´Ã£Ââ€”Ã£ÂÂ¦Ã£ÂÂÃ£ÂÂ Ã£Ââ€¢Ã£Ââ€žÃ¯Â¼â€° */
  width: 100%;
  box-sizing: border-box;
}

/* Ã¥Ââ€žFAQÃ£ÂÂ®Ã¥Â¡Å Ã¯Â¼Ë†liÃ¨Â¦ÂÃ§Â´Â Ã¯Â¼â€° */
.faq_list > li {
  background-color: #ffffff; /* Ã§â„¢Â½Ã£Æ’â„¢Ã£Æ’Â¼Ã£â€šÂ¹ */
  border: 1px solid #e2e8f0; /* Ã¨â€“â€žÃ£Ââ€žÃ¥Â¢Æ’Ã§â€¢Å’Ã§Â·Å¡ */
  border-radius: 8px; /* Ã¨Â§â€™Ã£â€šâ€™Ã¥Â°â€˜Ã£Ââ€”Ã¤Â¸Â¸Ã£ÂÂ */
  margin-bottom: 20px; /* Ã¨Â³ÂªÃ¥â€¢ÂÃ£Ââ€Ã£ÂÂ¨Ã£ÂÂ®Ã¤Â½â„¢Ã§â„¢Â½ */
  overflow: hidden; /* Ã¨Æ’Å’Ã¦â„¢Â¯Ã¨â€°Â²Ã£ÂÂ®Ã£ÂÂ¯Ã£ÂÂ¿Ã¥â€¡ÂºÃ£Ââ€”Ã©ËœÂ²Ã¦Â­Â¢ */
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.02); /* Ã¨Â»Â½Ã£Ââ€žÃ¥Â½Â±Ã£ÂÂ§Ã§Â«â€¹Ã¤Â½â€œÃ¦â€žÅ¸Ã£â€šâ€™Ã¥â€¡ÂºÃ£Ââ„¢ */
  list-style: none;
  padding: 0 !important;
}

/* ==========================================================================
   QÃ¯Â¼Ë†Ã¨Â³ÂªÃ¥â€¢ÂÃ¯Â¼â€°Ã£ÂÂ®Ã¨Â£â€¦Ã©Â£Â¾
   ========================================================================== */
.faq_list > li > h4 {
  position: relative;
  margin: 0;
  padding: 18px 20px;
  font-size: 16px;
  line-height: 1.5;
  font-weight: 600;
  color: #1a202c;
  /* Ã£â€šÂ¢Ã£â€šÂ¯Ã£â€šÂ»Ã£Æ’Â³Ã£Æ’Ë†Ã£â€šÂ«Ã£Æ’Â©Ã£Æ’Â¼Ã¯Â¼Ë†#1ca577Ã¯Â¼â€°Ã£â€šâ€™Ã¦Â¥ÂµÃ©â„¢ÂÃ£ÂÂ¾Ã£ÂÂ§Ã¨â€“â€žÃ£â€šÂÃ£ÂÅ¸Ã¨Æ’Å’Ã¦â„¢Â¯Ã¨â€°Â²Ã£ÂÂ§QÃ£â€šÂ¨Ã£Æ’ÂªÃ£â€šÂ¢Ã£â€šâ€™Ã¥Â¼Â·Ã¨ÂªÂ¿ */
  background-color: #EEE;
  border-bottom: 1px solid #DDD;
}

/* Ã£â‚¬Å’Q.Ã£â‚¬ÂÃ£ÂÂ®Ã¦â€“â€¡Ã¥Â­â€”Ã£ÂÂ Ã£Ââ€˜Ã¨â€°Â²Ã£â€šâ€™Ã¥Â¤â€°Ã£ÂË†Ã£ÂÂ¦Ã§â€ºÂ®Ã§Â«â€¹Ã£ÂÅ¸Ã£Ââ€ºÃ£â€šâ€¹Ã¯Â¼Ë†HTMLÃ¥â€ â€¦Ã£ÂÂ®Ã¦â€“â€¡Ã¥Â­â€”Ã¨â€°Â²Ã£â€šâ€™Ã¥Â¤â€°Ã¦â€ºÂ´Ã¯Â¼â€° */
.faq_list > li > h4::first-letter {
  color: #257319; /* Ã£â€šÂ¢Ã£â€šÂ¯Ã£â€šÂ»Ã£Æ’Â³Ã£Æ’Ë†Ã£â€šÂ«Ã£Æ’Â©Ã£Æ’Â¼ */
  font-weight: 800;
  font-size: 20px;
  margin-right: 2px;
}

/* ==========================================================================
   AÃ¯Â¼Ë†Ã¥â€ºÅ¾Ã§Â­â€Ã¯Â¼â€°Ã£ÂÂ®Ã¨Â£â€¦Ã©Â£Â¾
   ========================================================================== */
.faq_list > li > p {
  margin: 0;
  padding: 18px 20px;
  font-size: 16px;
  line-height: 1.6;
  color: #4a5568;
  background-color: #fafafa; /* QÃ£ÂÂ¨Ã¥Å’ÂºÃ¥Ë†Â¥Ã£Ââ„¢Ã£â€šâ€¹Ã£ÂÅ¸Ã£â€šÂÃ£ÂÂ«Ã¨â€“â€žÃ£Ââ€žÃ£â€šÂ°Ã£Æ’Â¬Ã£Æ’Â¼Ã¨Æ’Å’Ã¦â„¢Â¯ */
  margin: 0 !important;
}

/* Ã£â‚¬Å’A.Ã£â‚¬ÂÃ£ÂÂ®Ã¦â€“â€¡Ã¥Â­â€”Ã£ÂÂ Ã£Ââ€˜Ã¨â€°Â²Ã£â€šâ€™Ã¥Â¤â€°Ã£ÂË†Ã£ÂÂ¦Ã§â€ºÂ®Ã§Â«â€¹Ã£ÂÅ¸Ã£Ââ€ºÃ£â€šâ€¹ */
.faq_list > li > p::first-letter {
  color: #e24343; /* Ã¥â€ºÅ¾Ã§Â­â€Ã£ÂÂ¨Ã¥Ë†â€ Ã£Ââ€¹Ã£â€šÅ Ã£â€šâ€žÃ£Ââ„¢Ã£Ââ€žÃ£â€šË†Ã£Ââ€ Ã£ÂÂ«Ã¦Â¸Â©Ã£Ââ€¹Ã£ÂÂ¿Ã£ÂÂ®Ã£Ââ€šÃ£â€šâ€¹Ã£â€šÂªÃ£Æ’Â¬Ã£Æ’Â³Ã£â€šÂ¸Ã§Â³Â»Ã¯Â¼Ë†Ã¥Â¥Â½Ã£ÂÂ¿Ã£ÂÂ«Ã¥Â¿Å“Ã£ÂËœÃ£ÂÂ¦#1ca577Ã§Â­â€°Ã£ÂÂ«Ã¥Â¤â€°Ã£ÂË†Ã£ÂÂ¦Ã£â€šâ€šOKÃ£ÂÂ§Ã£Ââ„¢Ã¯Â¼â€° */
  font-weight: 800;
  font-size: 20px;
  margin-right: 2px;
}

/* ==========================================================================
   Ã§â€ºÂ£Ã¤Â¿Â®Ã¨â‚¬â€¦Ã¦Æ’â€¦Ã¥Â Â± Ã¥â€¦Â¨Ã¤Â½â€œÃ£ÂÂ®Ã£Æ’Å“Ã£Æ’Æ’Ã£â€šÂ¯Ã£â€šÂ¹
   ========================================================================== */
.super_visor {
  background-color: #ffffff; /* Ã§â„¢Â½Ã£Æ’â„¢Ã£Æ’Â¼Ã£â€šÂ¹ */
  border: 1px solid #e2e8f0; /* Ã¨â€“â€žÃ£Ââ€žÃ¥Â¤â€“Ã¦Å¾Â  */
  border-radius: 12px; /* Ã¨Â§â€™Ã£â€šâ€™Ã¤Â¸Â¸Ã£ÂÂÃ£Ââ€”Ã£ÂÂ¦Ã¦Å¸â€Ã£â€šâ€°Ã£Ââ€¹Ã£Ââ€žÃ¥ÂÂ°Ã¨Â±Â¡Ã£ÂÂ« */
  padding: 30px;
   /* Ã¨ÂªÂ­Ã£ÂÂ¿Ã£â€šâ€žÃ£Ââ„¢Ã£Ââ€žÃ¦Â¨ÂªÃ¥Â¹â€¦Ã£ÂÂ«Ã¥Ë†Â¶Ã©â„¢Â */
  margin: 0 auto;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03); /* Ã¨Â»Â½Ã£Ââ€žÃ¥Â½Â±Ã£ÂÂ§Ã¤Â¸Å Ã¥â€œÂÃ£ÂÂªÃ§Â«â€¹Ã¤Â½â€œÃ¦â€žÅ¸ */
  box-sizing: border-box;
  margin: 0 0 30px;
}

/* ==========================================================================
   Ã£â€šÂ¿Ã£â€šÂ¤Ã£Æ’Ë†Ã£Æ’Â«Ã¯Â¼Ë†H2Ã¯Â¼â€°
   ========================================================================== */
.super_visor h2 {
  font-size: 1.25rem;
  color: #1a202c;
  margin: 0 0 25px 0;
  padding-bottom: 10px;
  position: relative;
  font-weight: 700;
  border-bottom: none;
}

/* Ã£â€šÂ¿Ã£â€šÂ¤Ã£Æ’Ë†Ã£Æ’Â«Ã£ÂÂ®Ã¤Â¸â€¹Ã§Â·Å¡Ã¯Â¼Ë†Ã£â€šÂ¢Ã£â€šÂ¯Ã£â€šÂ»Ã£Æ’Â³Ã£Æ’Ë†Ã£â€šÂ«Ã£Æ’Â©Ã£Æ’Â¼Ã£ÂÂ®2Ã¨â€°Â²Ã£Æ’Â©Ã£â€šÂ¤Ã£Æ’Â³Ã¯Â¼â€° */
.super_visor h2::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 60px; /* Ã¥Â¤ÂªÃ£Ââ€žÃ§Â·Å¡Ã£ÂÂ®Ã©â€¢Â·Ã£Ââ€¢ */
  height: 3px;
  background-color: #6adc64; /* Ã£â€šÂ¢Ã£â€šÂ¯Ã£â€šÂ»Ã£Æ’Â³Ã£Æ’Ë†Ã£â€šÂ«Ã£Æ’Â©Ã£Æ’Â¼ */
}

.super_visor h2::before {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%; /* Ã¥â€¦Â¨Ã¤Â½â€œÃ£ÂÂ®Ã¨â€“â€žÃ£Ââ€žÃ§Â·Å¡Ã£ÂÂ®Ã©â€¢Â·Ã£Ââ€¢ */
  height: 1px;
  background-color: #DDD;
}

/* ==========================================================================
   Ã¨Â¨ËœÃ¤Âºâ€¹Ã£Æ’Â»Ã£Æ’Â¬Ã£â€šÂ¤Ã£â€šÂ¢Ã£â€šÂ¦Ã£Æ’Ë†Ã£â€šÂ¨Ã£Æ’ÂªÃ£â€šÂ¢
   ========================================================================== */
.super_visor article {
  display: flex;
  flex-direction: column;
  gap: 20px; /* Ã¥Ââ€žÃ©Â â€¦Ã§â€ºÂ®Ã£ÂÂ®Ã©â€“â€œÃ©Å¡â€ */
}

/* Ã¥Â®Å¡Ã§Â¾Â©Ã£Æ’ÂªÃ£â€šÂ¹Ã£Æ’Ë†Ã¯Â¼Ë†dlÃ¯Â¼â€° */
.super_visor dl {
  margin: 0;
  display: block;
  flex-flow: row wrap;
}

/* Ã©Â â€¦Ã§â€ºÂ®Ã¥ÂÂÃ¯Â¼Ë†dtÃ¯Â¼Å¡Ã©â„¢Â¢Ã©â€¢Â·Ã£Æ’Â»Ã£â€šÂ³Ã£Æ’Â¡Ã£Æ’Â³Ã£Æ’Ë†Ã¯Â¼â€° */
.super_visor dt {
  font-weight: 700;
  color: #6adc64; /* Ã£â€šÂ¢Ã£â€šÂ¯Ã£â€šÂ»Ã£Æ’Â³Ã£Æ’Ë†Ã£â€šÂ«Ã£Æ’Â©Ã£Æ’Â¼ */
  width: 60px;
  margin-right: 20px;
  margin-bottom: 10px;
}

/* Ã©Â â€¦Ã§â€ºÂ®Ã¥ÂÂÃ£ÂÂ®Ã¤Â¸Â­Ã£ÂÂ®spanÃ¯Â¼Ë†Ã£Æ’â€¡Ã£â€šÂ¶Ã£â€šÂ¤Ã£Æ’Â³Ã£ÂÂ®Ã¨ÂªÂ¿Ã¦â€¢Â´Ã§â€Â¨Ã¯Â¼â€° */
.super_visor dt span {
  background-color: #EEE; /* Ã£â€šÂ¢Ã£â€šÂ¯Ã£â€šÂ»Ã£Æ’Â³Ã£Æ’Ë†Ã£â€šÂ«Ã£Æ’Â©Ã£Æ’Â¼Ã£ÂÂ®Ã¨â€“â€žÃ£Ââ€žÃ¨Æ’Å’Ã¦â„¢Â¯ */
  padding: 4px 12px;
  border-radius: 4px;
  width: 100%;
  display: block;
  text-align: center;
}

/* ==========================================================================
   Ã¥Ââ€žÃ©Â â€¦Ã§â€ºÂ®Ã£ÂÂ®Ã¥â€ â€¦Ã¥Â®Â¹Ã¯Â¼Ë†ddÃ¯Â¼Å¡Ã¥ÂÂÃ¥â€°ÂÃ£Æ’Â»Ã¦Å“Â¬Ã¦â€“â€¡Ã¯Â¼â€°
   ========================================================================== */
.super_visor dl:nth-of-type(1) dd {
  /* Ã©â„¢Â¢Ã©â€¢Â·Ã¥ÂÂÃ£ÂÂ®Ã£â€šÂ¹Ã£â€šÂ¿Ã£â€šÂ¤Ã£Æ’Â« */
  font-size: 16px;
  margin: 0;
  padding-left: 4px;
  padding: 0;
  flex: 1;
}

.super_visor dl:nth-of-type(2) dd {
  /* Ã£â€šÂ³Ã£Æ’Â¡Ã£Æ’Â³Ã£Æ’Ë†Ã¦Å“Â¬Ã¦â€“â€¡Ã£ÂÂ®Ã£â€šÂ¹Ã£â€šÂ¿Ã£â€šÂ¤Ã£Æ’Â« */
  line-height: 1.75; /* Ã¦â€“â€¡Ã§Â«Â Ã£ÂÅ’Ã©â€¢Â·Ã£Ââ€žÃ£ÂÅ¸Ã£â€šÂÃ£â‚¬ÂÃ¨Â¡Å’Ã©â€“â€œÃ£â€šâ€™Ã¥Â°â€˜Ã£Ââ€”Ã¥ÂºÆ’Ã£Ââ€™Ã£ÂÂ¦Ã¨ÂªÂ­Ã£ÂÂ¿Ã£â€šâ€žÃ£Ââ„¢Ã£ÂÂ */
  color: #4a5568;
  margin: 0;
  padding: 0;
   /* Ã£â€šÂ³Ã£Æ’Â¡Ã£Æ’Â³Ã£Æ’Ë†Ã£â€šÂ¨Ã£Æ’ÂªÃ£â€šÂ¢Ã£â€šâ€™Ã¨â€“â€žÃ£Ââ€žÃ£â€šÂ°Ã£Æ’Â¬Ã£Æ’Â¼Ã£ÂÂ§Ã¥Â·Â®Ã¥Ë†Â¥Ã¥Å’â€“ */
  border-radius: 0;
  flex: 1;
}

/* ==========================================================================
   Ã£Æ’Â¬Ã£â€šÂ¹Ã£Æ’ÂÃ£Æ’Â³Ã£â€šÂ·Ã£Æ’â€“Ã¥Â¯Â¾Ã¥Â¿Å“Ã¯Â¼Ë†Ã£â€šÂ¹Ã£Æ’Å¾Ã£Æ’â€ºÃ¥Ââ€˜Ã£Ââ€˜Ã£ÂÂ®Ã¥Â¾Â®Ã¨ÂªÂ¿Ã¦â€¢Â´Ã¯Â¼â€°
   ========================================================================== */
@media screen and (max-width: 480px) {
  .super_visor {
    padding: 20px; /* Ã¤Â½â„¢Ã§â„¢Â½Ã£â€šâ€™Ã¥Â°â€˜Ã£Ââ€”Ã§â€¹Â­Ã£ÂÂ */
  }
  
  .super_visor h2 {
    font-size: 1.15rem;
    margin-bottom: 20px;
  }
  
  .super_visor dl:nth-of-type(1) dd {
    font-size: 1.2rem; /* Ã¥ÂÂÃ¥â€°ÂÃ£â€šâ€™Ã¥Â°â€˜Ã£Ââ€”Ã£â€šÂ¹Ã£Æ’Å¾Ã£Æ’â€ºÃ¥Ââ€˜Ã£Ââ€˜Ã£ÂÂ«Ã§Â¸Â®Ã¥Â°Â */
  }

  .super_visor dl:nth-of-type(2) dd {
    font-size: 0.9rem;
    padding: 0; /* Ã£â€šÂ³Ã£Æ’Â¡Ã£Æ’Â³Ã£Æ’Ë†Ã£ÂÂ®Ã£Æ’â€˜Ã£Æ’â€¡Ã£â€šÂ£Ã£Æ’Â³Ã£â€šÂ°Ã£â€šâ€™Ã¨ÂªÂ¿Ã¦â€¢Â´ */
  }
}