@charset "UTF-8";
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    font-size: 100%;
    vertical-align: baseline;
}
*:before,
*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
html {
    font-size: 16px;
    height: 100%;
    margin: 0;
    padding: 0;
    width: 100%;
}
body {
    font-family: 'Noto Serif JP', 'YuMincho Demibold', メイリオ, Meiryo, serif;
    cursor: auto;
    width: 100%;
    color: #000000;
    font-size: 1rem;
    line-height: 170%;
    word-break: break-word;
    font-weight: 500;
}
.yumincho-extrabold-font{
    font-family: 'Noto Serif JP', 'YuMincho Extrabold', メイリオ, Meiryo, serif;
    font-weight: 700;
}
.title-font{
    font-family: 'Noto Serif JP', 'Garamond Premier Pro', 'YuMincho Demibold', メイリオ, Meiryo, serif;
    font-weight: 500;
}
.you-gothic-font{
    font-family: 'Noto Serif JP', 'YuGothic', 'YuMincho Demibold', メイリオ, Meiryo, serif;
}
.you-gothic-medium-font{
    font-family: 'Noto Serif JP', 'YuGothic Medium', 'YuMincho Demibold', メイリオ, Meiryo, serif;
}
/*remove highlight color touch on mobile*/
input,textarea,button,select,div,a,span
{
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}
a, input, div, select, textarea, img, button
{
    outline: none;
}
a:focus, a:visited, input:focus, select:focus, textarea:focus, button:focus
{
    outline: none !important;
    box-shadow: none;
}
ol, ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.hidden-scroll, .hidden-scroll body
{
    overflow: hidden !important;
}
button
{
    font-family: inherit;
    cursor: pointer;
}
a {
    text-decoration: none;
    cursor: pointer;
}
a:hover,
button:hover,
input[type="submit"]:hover
{
    text-decoration: none;
    opacity:0.7;
    filter:alpha(opacity=70);
    -ms-filter: "alpha(opacity=70)";
}
img {
    max-width: 100%;
    width /***/: auto;
    height: auto;
}
::-webkit-input-placeholder { /* Edge */
  color: #cccccc;
  font-size: 1rem;
  opacity: 1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #cccccc;
  font-size: 1rem; opacity: 1;
}
::placeholder {
  color: #cccccc;
  font-size: 1rem; opacity: 1;
}
.container {
    margin: 0 auto;
    max-width: 1240px;
    position: relative;
    z-index: 10;
    padding-left: 20px;
    padding-right: 20px;
}
.container.md{
    max-width: 1120px;
}
.container.sm{
    max-width: 940px;
}
.d-flex
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}
.d-flex-wrap
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    flex-wrap: wrap;
}
.d-flex-center
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
.d-flex-align-center
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
.d-inline-block
{
    display: inline-block;
}
.d-inline-block-full
{
    display: inline-block;
    width: 100%;
}
.text-left{
    text-align: left !important;
}
.text-right{
    text-align: right !important;
}
.text-center{
    text-align: center;
}
.mg-0 {margin: 0}
.mt-0 {margin-top: 0px;}
.mt-5 {margin-top: 5px;}
.mt-10 {margin-top: 10px;}
.mt-15 {margin-top: 15px;}
.mt-20 {margin-top: 20px;}
.mt-25 {margin-top: 25px;}
.mt-30 {margin-top: 30px;}
.mt-35 {margin-top: 35px;}
.mt-40 {margin-top: 40px;}
.mt-45 {margin-top: 45px;}
.mt-50 {margin-top: 50px;}
.mr-0 {margin-right: 0px;}
.mr-5 {margin-right: 5px;}
.mr-10 {margin-right: 10px;}
.mr-15 {margin-right: 15px;}
.mr-20 {margin-right: 20px;}
.mr-25 {margin-right: 25px;}
.mr-30 {margin-right: 30px;}
.mr-35 {margin-right: 35px;}
.mr-40 {margin-right: 40px;}
.mr-45 {margin-right: 45px;}
.mr-50 {margin-right: 50px;}
.mb-0 {margin-bottom: 0px;}
.mb-5 {margin-bottom: 5px;}
.mb-10 {margin-bottom: 10px;}
.mb-15 {margin-bottom: 15px;}
.mb-20 {margin-bottom: 20px;}
.mb-25 {margin-bottom: 25px;}
.mb-30 {margin-bottom: 30px;}
.mb-35 {margin-bottom: 35px;}
.mb-40 {margin-bottom: 40px;}
.mb-45 {margin-bottom: 45px;}
.mb-50 {margin-bottom: 50px;}
.ml-0 {margin-left: 0px;}
.ml-5 {margin-left: 5px;}
.ml-10 {margin-left: 10px;}
.ml-15 {margin-left: 15px;}
.ml-20 {margin-left: 20px;}
.ml-25 {margin-left: 25px;}
.ml-30 {margin-left: 30px;}
.ml-35 {margin-left: 35px;}
.ml-40 {margin-left: 40px;}
.ml-45 {margin-left: 45px;}
.ml-50 {margin-left: 50px;}
.pd-0 {padding: 0}
.pd-10 {padding: 10px;}
.pd-15 {padding: 15px;}
.pd-20 {padding: 20px;}
.pd-25 {padding: 25px;}
.pd-30 {padding: 30px;}
.pt-0 {padding-top: 0px;}
.pt-5 {padding-top: 5px;}
.pt-10 {padding-top: 10px;}
.pt-15 {padding-top: 15px;}
.pt-20 {padding-top: 20px;}
.pt-25 {padding-top: 25px;}
.pt-30 {padding-top: 30px;}
.pt-35 {padding-top: 35px;}
.pt-40 {padding-top: 40px;}
.pt-45 {padding-top: 45px;}
.pt-50 {padding-top: 50px;}
.pr-0 {padding-right: 0px;}
.pr-5 {padding-right: 5px;}
.pr-10 {padding-right: 10px;}
.pr-15 {padding-right: 15px;}
.pr-20 {padding-right: 20px;}
.pr-25 {padding-right: 25px;}
.pr-30 {padding-right: 30px;}
.pr-35 {padding-right: 35px;}
.pr-40 {padding-right: 40px;}
.pr-45 {padding-right: 45px;}
.pr-50 {padding-right: 50px;}
.pb-0 {padding-bottom: 0px;}
.pb-5 {padding-bottom: 5px;}
.pb-10 {padding-bottom: 10px;}
.pb-15 {padding-bottom: 15px;}
.pb-20 {padding-bottom: 20px;}
.pb-25 {padding-bottom: 25px;}
.pb-30 {padding-bottom: 30px;}
.pb-35 {padding-bottom: 35px;}
.pb-40 {padding-bottom: 40px;}
.pb-45 {padding-bottom: 45px;}
.pb-50 {padding-bottom: 50px;}
.pl-0 {padding-left: 0px;}
.pl-5 {padding-left: 5px;}
.pl-10 {padding-left: 10px;}
.pl-15 {padding-left: 15px;}
.pl-20 {padding-left: 20px;}
.pl-25 {padding-left: 25px;}
.pl-30 {padding-left: 30px;}
.pl-35 {padding-left: 35px;}
.pl-40 {padding-left: 40px;}
.pl-45 {padding-left: 45px;}
.pl-50 {padding-left: 50px;}
/*
==============================================================
============================ Common ==========================
==============================================================
*/
/* button =================================================== */
.btn{
    font-size: 1.18rem;
    position: relative;
    width: 306px;
    padding: 30px 10px;
    text-align: center;
    display: inline-block;
    line-height: 1;
    color: #fff;
    transition: .4s;
}
.btn.small{
    width: 210px;
    padding: 22px 10px;
}
.btn:before {
  content: "";
  position: absolute;
  right: 10px;
  top: 50%;
  margin-top: -11px;
  width: 22px;
  height: 22px;
  background: #000;
}
.btn:after {
  content: "";
  position: absolute;
  right: 19px;
  top: 50%;
  margin-top: -4px;
  border: solid #fff;
  border-width: 0 1px 1px 0px;
  display: inline-block;
  padding: 1px;
  width: 8px;
  height: 8px;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}
.btn.no-icon:before
{
    background: none !important;
}
.btn.no-icon:after
{
    border: none !important;
}
.btn.white
{
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
}
.btn.white:before{
    background: #fff;
}
.btn.white:after,
.btn.black.bg:after{
    border-color: #000;
}
.btn.white:hover{
    background: #fff;
    color: #000;
}
.btn.white:hover:before{
    background: #000;
}
.btn.white:hover:after{
    border-color: #fff;
}
.btn.white.bg{
    background: #fff;
    color: #000;
    border: none;
}
.btn:hover
{
    opacity: 1;
}
.btn:hover,
.btn:hover:before,
.btn:hover:after
{
    transition: .4s;
}
.btn.white.bg:before
{
    background: #000;
}
.btn.white.bg:after
{
    border-color: #fff;
}
.btn.black
{
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
    color: #000;
}
.btn.black:before{
    background: #000;
}
.btn.black:after{
    border-color: #fff;
}
.btn.black:hover{
    background: #000;
    color: #fff;
}
.btn.black:hover:before{
    background: #fff;
}
.btn.black:hover:after{
    border-color: #000;
}
.btn.black.bg{
    background: #000;
    color: #fff;
    border: none;
}
.btn.black.bg:before
{
    background: #fff;
}
.btn.white.bg:hover,
.btn.black.bg:hover
{
    box-shadow:0px 0px 0px 1px #cccccc90 inset;
}
.btn.black.bg:hover{
    background: #fff;
    color: #000;
}
.btn.black.bg:hover:before{
    background: #000;
}
.btn.black.bg:hover:after{
    border-color: #fff;
}
.btn.white.bg:hover{
    background: #000;
    color: #fff;
}
.btn.white.bg:hover:before{
    background: #fff;
}
.btn.white.bg:hover:after{
    border-color: #000;
}
@keyframes aniFadeButton
{
    0%{opacity: 0}
    100%{opacity: 1;}
}
@media(max-width: 576px){
    .btn,
    .btn.small{
        width: 100%;
        max-width: 100%;
        padding: 23px 10px;
    }
}
/* background content ============================================= */
.bg-content
{
    padding-left: 50px;
}
.bg-content h2{
    font-size: 2.9rem;
    line-height: 1.3;
}
.bg-content h2,
.bg-content .note,
.bg-content .content{
    position: relative;
    z-index: 2;
}
.bg-content .content
{
    display: inline-block;
    width: 100%;
    margin-top: 20px;
}
.bg-content .note{
    position: relative;
    bottom: 0;
}
.bg-content{
    display: inline-block;
    width: 100%;
    position: relative;
    z-index: 2;
}
.bg-content:before{
    content: '';
    position: absolute;
    left: 22px;
    top: 0;
    bottom: 0;
    width: 66px;
    z-index: 1;
    background: #BBD2D8;
    background: -moz-linear-gradient(180deg, #BBD2D8 0%, #ffffff 100%);
    background: -webkit-linear-gradient(180deg, #BBD2D8 0%, #ffffff 100%);
    background: linear-gradient(180deg, #BBD2D8 0%, #ffffff 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#BBD2D8",endColorstr="#ffffff",GradientType=1);
}
.bg-group
{
    background: url('../img/bg-group.png');
}
.bg-gradient-90
{
    background: #D6E4E8;
    background: -moz-linear-gradient(90deg, rgba(214,228,232,0.7) 0%, rgba(214,228,232,0.3) 100%);
    background: -webkit-linear-gradient(90deg, rgba(214,228,232,0.7) 0%, rgba(214,228,232,0.3) 100%);
    background: linear-gradient(90deg, rgba(214,228,232,0.7) 0%, rgba(214,228,232,0.3) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#d6e4e8",endColorstr="#fafbfc",GradientType=1);
}
.bg-gradient-180{
    background: #D6E4E8;
    background: -moz-linear-gradient(180deg, #D6E4E8 0%, #FAFBFC 100%);
    background: -webkit-linear-gradient(180deg, #D6E4E8 0%, #FAFBFC 100%);
    background: linear-gradient(180deg, #D6E4E8 0%, #FAFBFC 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#D6E4E8",endColorstr="#FAFBFC",GradientType=1);
}
@media(max-width: 768px){
    .bg-content
    {
        padding-left: 58px;
    }
    .bg-content h2{
        font-size: 2.3rem;
    }
}
@media(max-width: 576px){
    .bg-content
    {
        padding-left: 28px;
    }
    .bg-content h2{
        font-size: 2rem;
    }
    .bg-content:before{
        width: 54px;
        left: 0;
    }
    br.hdn-sp{
        display: none;
    }
}
@media(max-width: 428px){
    .bg-content h2{
        font-size: 1.8rem;
    }
}
@media(max-width: 375px){
    .bg-content
    {
        padding-left: 25px;
    }
    .bg-content:before{
        width: 50px;
    }
    .bg-content h2{
        font-size: 1.6rem;
    }
}
@media(max-width: 320px){
    .bg-content h2{
        font-size: 1.35rem;
    }
}
/* text description ========================================= */
.text-desc
{
    font-size: 0.93rem;
    position: absolute;
    color: #000;
    top: 0;
    transform: rotate(90deg);
    padding-right: 125px;
    line-height: 1;
}
.text-desc:before{
    content: '';
    position: absolute;
    right: 0;
    width: 115px;
    height: 1px;
    top: 50%;
    margin-top: 2px;
    background: #000;
}
/* main title ========================================= */
h2.title,
.page__title{
    font-size: 2.9rem;
    font-family: 'Noto Serif JP', 'Garamond Premier Pro', 'YuMincho Demibold', メイリオ, Meiryo, serif;
    line-height: 1.3;
    overflow: hidden;
}
h2.title.bg1 span,
h2.title.bg2 span
{
    display: inline-block;
    position: relative;
    z-index: 2;
}
h2.title.bg1 span:before,
h2.title.bg2 span:before{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 578px;
    z-index: -1;
}
h2.title.bg1 span:before{
    background: url('../img/bg-title2.png') no-repeat;
    background-size: 100% 100%;
}
h2.title.bg2 span:before{
    background: url('../img/bg-title3.png') no-repeat;
    background-size: 100% 100%;
}
h2.title.bg1 span,
h2.title.bg2 span
{
    padding: 4px 0px 6px 25px;
}
h2.title span.small{
    background: none !important;
    font-size: 1.25rem;
    font-family: 'Noto Serif JP', 'YuGothic', 'YuMincho Demibold', メイリオ, Meiryo, serif;
    font-weight: bold;
    padding: 0 0 0 30px;
    position: relative;
    bottom: 2px;
}
h2.title span.small:before{
    background: none !important;
    width: 0 !important;
}
.title-inline
{
    display: inline-block;
    width: 100%;
    text-align: center;
}
.title-inline h2.title
{
    display: inline-block;
}
@media(max-width: 768px){
    h2.title,
    .page__title{
        font-size: 2.7rem;
    }
}
@media(max-width: 576px){
    h2.title,
    .page__title{
        font-size: 2.4rem;
    }
    h2.title.bg1 span,
    h2.title.bg2 span
    {
        padding: 7px 0px 3px 15px;
    }
    h2.title span.small
    {
        display: block;
        padding: 0;
    }
    h2.title.bg1 span:before{
        width: calc(100% + 150px);
    }
    h2.title.bg2 span:before{
        width: calc(100% + 200px);
    }
}
@media(max-width: 480px){
    h2.title,
    .page__title{
        font-size: 2.1rem;
    }
    h2.title.bg1 span:before{
        width: calc(100% + 120px);
    }
    h2.title.bg2 span:before{
        width: calc(100% + 170px);
    }
}
@media(max-width: 414px){
    h2.title,
    .page__title{
        font-size: 2rem;
    }
    h2.title.bg1 span:before{
        width: calc(100% + 100px);
    }
    h2.title.bg2 span:before{
        width: calc(100% + 110px);
    }
}
@media(max-width: 375px){
    h2.title,
    .page__title{
        font-size: 1.85rem;
    }
    h2.title.bg1 span:before{
        width: calc(100% + 90px);
    }
    h2.title.bg2 span:before{
        width: calc(100% + 100px);
    }
}
/* group content ========================================= */
.content-group h2.title{
    margin-bottom: 30px;
}
.content-group .content
{
    width: 60%;
    position: relative;
}
.content-group .content.full
{
    width: 100%;
}
.content-group .item-img{
    width: 40%;
    padding-top: 40px;
}
.content-group .item-img img{
    width: 100%;
}
.content-group .content .inner
{
    position: relative;
    display: block;
    z-index: 3;
    padding: 35px 20px 30px 115px;
}
.content-group .content.bg .inner{
    padding: 60px 20px 80px 115px;
}
.content-group .content:before,
.content-group .content:after{
    content: '';
    position: absolute;
}
.content-group .content:before{
    left: 59px;
    top: 0px;
    bottom: 30px;
    width: 1px;
    z-index: 2;
    background: #000;
}
.content-group .content.bg:before{
    top: -60px;
    bottom: 70px;
}
.content-group .content:after{
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
}
.content-group .content.bg:after{
    background: #EFF4F5;
}
@media(max-width: 768px){
    .content-group .content
    {
        width: 100%;
    }
    .content-group .content .inner{
        padding-right: 60px;
    }
    .content-group .content.bg .inner{
        padding-right: 60px;
    }
    .content-group .item-img
    {
        display: inline-block;
        width: 100%;
        text-align: center;
        padding: 0 58px;
    }
}
@media(max-width: 576px){
    .content-group h2.title
    {
        margin-bottom: 10px;
    }
    .content-group .content .inner{
        padding: 25px 0;
    }
    .content-group .content.bg .inner{
        padding-right: 0px;
    }
    .content-group .item-img
    {
        display: inline-block;
        width: 100%;
        text-align: center;
        padding: 0;
    }
    .content-group .content:before{
        background: none;
    }
}
/* nav page ======================================================= */
.nav-page
{
    display: inline-block;
    width: 100%;
    border-bottom: 1px solid #000;
    margin-bottom: 58px;
}
.nav-page .container
{
    max-width: 1330px;
    padding-left: 65px;
    padding-right: 65px;
}
.nav-page ul
{
    margin-left: -65px;
    margin-right: -65px;
    padding: 34px 0;
}
.nav-page ul li
{
    font-size: 1.375rem;
    padding-left: 65px;
    padding-right: 65px;
    cursor: pointer;
}
.nav-page ul li:hover{
    opacity: 0.5;
}
.nav-page ul span{
    display: inline-block;
    position: relative;
    padding-right: 18px;
}
.nav-page ul span:before,
.nav-page ul span:after{
    content: '';
    position: absolute;
}
.nav-page ul span:before
{
    right: 5px;
    width: 1px;
    height: 12px;
    background: #000;
    top: 50%;
    margin-top: -5px;
}
.nav-page ul span:after
{
    right: 2px;
    top: 50%;
    border-color: #000;
    border-width: 0 0.5px 0.5px 0px;
    border-style: solid;
    display: inline-block;
    padding: 3px;
    width: 0;
    height: 4px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}
.page-template{
    padding: 58px 0;
}
@media(max-width: 1200px){
    .nav-page .container
    {
        padding-left: 40px;
        padding-right: 40px;
    }
    .nav-page ul
    {
        margin-left: -40px;
        margin-right: -40px;
    }
    .nav-page ul li
    {
        padding-left: 40px;
        padding-right: 40px;
        display: inline-block;
    }
}
@media(max-width: 1100px){
    .nav-page .container
    {
        padding-left: 30px;
        padding-right: 30px;
    }
    .nav-page ul
    {
        margin-left: -30px;
        margin-right: -30px;
    }
    .nav-page ul li
    {
        padding-left: 30px;
        padding-right: 30px;
    }
}
@media(max-width: 1024px){
    .nav-page .container
    {
        padding-left: 20px;
        padding-right: 20px;
    }
    .nav-page ul
    {
        margin-left: -20px;
        margin-right: -20px;
    }
    .nav-page ul li
    {
        padding-left: 20px;
        padding-right: 20px;
    }
}
@media(max-width: 960px){
    .nav-page ul
    {
        margin-left: -10px;
        margin-right: -10px;
    }
    .nav-page ul li
    {
        padding-left: 10px;
        padding-right: 10px;
    }
}
@media(max-width: 768px){
    .nav-page ul
    {
        margin-left: -10px;
        margin-right: -10px;
    }
    .nav-page ul li
    {
        padding-left: 10px;
        padding-right: 10px;
        font-size: 1.05rem;
    }
}
@media(max-width: 576px){
    .nav-page
    {
        margin-bottom: 50px;
    }
    .nav-page ul
    {
        margin-left: 0px;
        margin-right: 0px;
        flex-wrap: wrap;
        padding: 15px 0;
    }
    .nav-page ul li
    {
        padding-left: 0px;
        padding-right: 0px;
        font-size: 1.2rem;
        width: 100%;
        padding: 5px 0;
    }
    .page-template{
        padding: 50px 0;
    }
}
@media(max-width: 375px){
    .nav-page ul li
    {
        font-size: 1.15rem;
    }
}
@media(max-width: 320px){
    .nav-page ul li
    {
        font-size: 0.97rem;
    }
}
/* animation ========================================= */
.ani-img-left{
    animation: aniImageLeft 1 linear 1s;
}
.ani-img-right{
    animation: aniImageRight 1 linear 1s;
}
@keyframes aniImageLeft
{
    0%{left: -100%;opacity: 0}
    100%{left: 0; opacity: 1;}
}
@keyframes aniImageRight
{
    0%{right: -100%; opacity: 0;}
    100%{right: 0; opacity: 1;}
}
.horizontal-scroll
{
    overflow-x: auto;
    padding-bottom: 15px;
    width: 100%;
    display: block;
}
/* detailed information ========================================= */
.detailed-info
{
    display: inline-block;
    width: 100%;
}
.detailed-info .row{
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    border-bottom: 1px solid #4C4948;
}
.detailed-info .row:first-child
{
    border-top: 1px solid #4C4948;
}
.detailed-info .row .title,
.detailed-info .row .txt
{
    padding: 30px 20px;
}
.detailed-info .row .title{
    font-family: 'Noto Serif JP', 'YuMincho Extrabold', メイリオ, Meiryo, serif;
    width: 240px;
    min-width: 240px;
    padding-right: 0;
    font-weight: 700;
}
.detailed-info .row .txt{
    flex: 1;
}
@media(max-width: 576px){
    .detailed-info .row
    {
        padding: 15px 5px 13px 5px;
    }
    .detailed-info .row .title,
    .detailed-info .row .txt
    {
        width: 100%;
        padding: 0px;
    }
    .detailed-info .row .title
    {
        margin-bottom: 7px;
        font-size: 1.1rem;
        line-height: 1.1;
    }
}
/* Pagination ===========================================*/
.pagination
{
    display: inline-block;
    width: 100%;
    text-align: center;
    margin: 40px 0 35px;
}
.pagination ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
.pagination li{
    padding: 5px;
}
.pagination li:first-child .page-link,
.pagination li:last-child .page-link,
.pagination a{
    display: inline-block;
    background: #fff;
    line-height: 1;
    color: #000;
    padding: 8px 12px;
    opacity: 1;
}
.pagination li:first-child .page-link,
.pagination li:last-child .page-link
{
    padding-left: 16px;
    padding-right: 16px;
}
.pagination li:hover a,
.pagination li.active span{
    background: #000;
    color: #fff;
    display: inline-block;
    line-height: 1;
    padding: 8px 12px;
}
.pagination li:first-child .page-link,
.pagination li:last-child .page-link
{
    text-indent: -999999px;
}
.pagination li.prev
{
    padding-right: 12px;
}
.pagination li.next
{
    padding-left: 12px;
}
.pagination li.prev a,
.pagination li:first-child .page-link
{
    background: url('../img/pagin-prev.png') no-repeat;
    background-position: center;
}
.pagination li.next a,
.pagination li:last-child .page-link
{
    background: url('../img/pagin-next.png') no-repeat;
    background-position: center;
}
.pagination li.prev a,
.pagination li.next a
{
    text-indent: -999999px;
    background-position: center;
}
/*
==============================================================
========================== End common ========================
==============================================================
*/
/*
==============================================================
============================== Form ==========================
==============================================================
*/
input,
textarea
{
    border: 1px solid #231815;
    padding: 16px 10px;
    background: #fff;
}
textarea
{
    resize: none;
}
input[type="checkbox"],
input[type="radio"],
input[type="button"],
input[type="submit"]
{
    border: none;
    padding: 0;
    background: none;
}
input.form-control,
textarea.form-control
{
    width: 100%;
}
.custom-select{
    position: relative;
    /* display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex; */
    display: inline-block;
    width: 100%;
}
.custom-select select {
    /*for chrome*/
   -webkit-appearance:none;
   /*for firefox*/
   -moz-appearance:none;
   -ms-appearance:none;
   appearance:none;
   outline:0;
   box-shadow:none;
   background: none;
   background-image: none;
   padding: 16px 10px;
   cursor:pointer;
   border: 1px solid #231815;
   width: 100%;
   position: relative;
}
/*for IE10+*/
.custom-select select select::-ms-expand {
    display: none;
}
/* .custom-select:after{
    content: '';
    position: absolute;
    right: 15px;
    top: 50%;
    margin-top: -5px;
    border-color: #231815;
    border-width: 0 1px 1px 0px;
    border-style: solid;
    display: inline-block;
    padding: 4px;
    width: 0;
    height: 0;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
} */
label.checkbox {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: left;
    -ms-flex-pack: left;
    -webkit-justify-content: left;
    justify-content: left;
    -webkit-box-align: flex-start;
    -ms-flex-align: flex-start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    flex-wrap: wrap;
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    line-height: 1.3;
}
label.checkbox input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}
label.checkbox .checkmark {
    position: absolute;
    top: 1px;
    left: 0px;
    height: 20px;
    width: 20px;
    border: 1px solid #231815;
    background: #fff;
}
label.checkbox input:disabled ~ .checkmark {
    background-color: #eee;
}
label.checkbox input:checked ~ .checkmark {
    background-color: #231815;
}
label.checkbox .checkmark:after {
    content: "";
    position: absolute;
    display: none;
}
label.checkbox input:checked ~ .checkmark:after {
    display: block;
}
label.checkbox .checkmark:after {
    left: 7px;
    top: 2px;
    width: 6px;
    height: 12px;
    border: solid white;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}
input[type='radio'] {
    position: relative;
    box-sizing: border-box;
    width: 22px;
    height: 22px;
    vertical-align: middle;
    cursor: pointer;
    content: '';
    background-color: #FFF;
    border: 1px solid #231815;
    appearance: button;
    -webkit-appearance: none;
    padding: 0;
    margin: 0;
    position: relative;
    bottom: 2px;
    right: 0px;
    margin-right: 10px;
}
input[type='radio'] {
    border-radius: 100%;
}
input[type='radio']:checked:after {
    position: absolute;
    top: 4px;
    left: 4px;
    display: block;
    width: 12px;
    height: 12px;
    content: '';
    background: #231815;
    border-radius: 6px;
}
.required-note{
    text-align: center;
}
.required-note span
{
    color: #A2272D;
}
.required span
{
    position: relative;
    padding-right: 20px;
}
.required span::after{
    content: '※';
    position: absolute;
    top: 50%;
    right: 0px;
    margin-top: -8px;
    color: #A2272D;
    letter-spacing: 2px;
    line-height: 100%;
    font-weight: normal;
}
.form-row
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    flex-wrap: wrap;
    border-bottom: 1px dotted #949291;
    padding: 35px 0;
}
.form-row:first-child{
    border-top: 1px dotted #949291;
}
.form-row label.title{
    padding: 0 20px;
    width: 230px;
    min-width: 230px;
    font-family: 'Noto Serif JP', 'YuMincho Extrabold', メイリオ, Meiryo, serif;
    font-weight: 700;
}
.form-row .control{
    flex: 1;
}
.form-row.flex-start
{
    -webkit-box-align: flex-start;
    -ms-flex-align: flex-start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
}
.form-row.flex-start label.title
{
    padding-top: 10px;
}
form .btn-group
{
    display: inline-block;
    width: 100%;
    padding-top: 80px;
    text-align: center;
}
.error
{
    color: #A2272D;
    font-size: 0.875rem;
    display: block;
}
@media(max-width: 576px){
    input[type="checkbox"],
    input[type="radio"]
    {
        width: 16px;
        height: 16px;
        bottom: -4px;
    }
    .form-row
    {
        padding: 14px 0px 22px;
    }
    .form-row label.title
    {
        width: 100% !important;
        min-width: 100% !important;
        margin-bottom: 3px;
        padding: 0;
    }
    .form-row .control{
        flex: auto;
    }
    .form-row.flex-start label.title
    {
        padding-top: 0px;
    }
    form .btn-group
    {
        padding-top: 45px;
    }
}
/*
==============================================================
=========================== End Form =========================
==============================================================
*/
/*
==============================================================
=========================== Articles =========================
==============================================================
*/
.articles li{
    border-bottom: 1px solid #4C4948;
}
.articles a{
    color: inherit;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    padding: 20px 0;
}
.articles li:last-child{
    border-bottom: none;
}
.articles a:hover{
    /* opacity: 1;
    animation: aniFadeButton 1 linear 0.4s; */
}
.articles a .date{
    width: 143px;
    min-width: 143px;
    padding-left: 2px;
}
.articles a .txt
{
    flex: 1;
}
@media(max-width: 960px){
    .articles a .date{
        width: 125px;
        min-width: 125px;
    }
}
@media(max-width: 576px){
    .articles a .date{
        width: 115px;
        min-width: 115px;
    }
}
@media(max-width: 480px){
    .articles a
    {
        flex-wrap: wrap;
    }
    .articles a .date{
        width: 100%;
        min-width: 100%;
    }
    .articles a .txt{
        flex: auto;
    }
}
/*
==============================================================
======================== End Articles ========================
==============================================================
*/
/*
==============================================================
======================== detail page =========================
==============================================================
*/
.detail-page
{
    padding: 80px 0;
}
.default-template
{
    padding: 50px 0;
}
.detail-page.full .content-detail
{
    max-width: 1040px;
    margin: 0 auto;
    flex: auto;
    width: 100%;
}
.detail-page .content-detail
{
    flex: 1;
}
.detail-page .content-detail .info__inner{
    display: block;
    padding: 60px;
    background: #fff;
    box-shadow: 0 0px 4px 2px rgba(0, 0, 0, 0.15);
}
.detail-page.full .content-detail .info__inner
{
    padding-left: 100px;
    padding-right: 100px;
}
.detail-page .wrap-btn
{
    margin-top: 50px;
}
.detail-page .info__date{
    margin-bottom: 10px;
}
.detail-page h2.title
{
    margin-bottom: 60px;
}
.detail-page .info__title
{
    border-bottom: 1px solid #4C4948;
    font-size: 2.6rem;
    line-height: 1.3;
    margin-bottom: 20px;
    padding-bottom: 10px;
    font-weight: 600;
}
.detail-page.full .info__title
{
    font-size: 1.6rem;
}
.detail-page .info__image
{
    display: inline-block;
    width: 100%;
    text-align: center;
    margin-bottom: 20px;
}
.detail-page .info__image img
{
    display: block;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    height: auto;
}
.detail-page .pagination
{
    margin: 20px 0 0;
}
.detail-page .info__inner .wrap-btn{
    margin: 15px 0 10px 0;
}
/* slider =================================================*/
.slider__info__image {
    position: relative;
    display: inline-block;
    width: 100%;
    z-index: 1;
    margin-bottom: 30px;
}
.slider__info__image.prd-slider
{
    max-width: 100%;
}
.slider__info__image .slick-list .slick-slide {
    opacity: 0.5;
}
.slider__info__image .slick-list .slick-slide.slick-current {
    opacity: 1;
}
.slider__info__image .slick-track
{
    display: flex;
    align-items: center;
    justify-self: center;
}
.slider__info__image .track {
    margin: 0;
    padding: 0;
    width: 100%;
    overflow: hidden;
    position: relative;
}
.slider__info__image .track img,
.slider__info__image .thumb img {
    position: absolute;
}
.slider__info__image .track li
{
    width: 100%;
    position: relative;
}
.slider__info__image .track li img {
    width: 100%;
    max-width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    position: absolute;
}
.slider__info__image .slick-slide img {
	width: 100%;
	height: auto;
}
.slider__info__image .slick-slide {
	transition: all ease-in-out .3s;
	opacity: .2;
}
.slider__info__image .slick-active {
	opacity: 1;
}
.slider__info__image .slick-current {
	opacity: 1;
}
.info__content .thumb {
    position: relative;
    padding: 0 40px;
    margin-top: 10px;
}
.slider__info__image .thumb ul.thumb
{
    margin: 20px -5px 0 -5px;
}
/* .slider__info__image_thumb ul.thumb img
{
    height: 50px !important;
    object-fit: cover;
} */
.slider__info__image .thumb .slick-slide {
	padding: 0 5px;
}
.slider__info__image .thumb .slick-slide {
	cursor: pointer;
}
.slider__info__image .thumb .slick-slide:hover {
	opacity: .7;
}
.slider__info__image .thumb .slick-prev,
.slider__info__image .thumb .slick-next
{
    position: absolute;
    width: 30px;
    height: 30px;
    background: #000;
    display: inline-block;
    top: 50%;
    margin-top: -15px;
    opacity: 1;
    transition: .4s;
    border: medium none;
    text-indent: -99999px;
}
.slider__info__image .thumb .slick-prev:hover,
.slider__info__image .thumb .slick-next:hover
{
    background: #fff;
    box-shadow:0px 0px 0px 1px #cccccc90 inset;
    transition: .4s;
}
.slider__info__image .thumb .slick-prev
{
    left: 0;
}
.slider__info__image .thumb .slick-next
{
    right: 0;
}
.slider__info__image .thumb .slick-prev:after,
.slider__info__image .thumb .slick-next:after {
    content: "";
    position: absolute;
    top: 50%;
    margin-top: -6px;
    border: solid #fff;
    display: inline-block;
    padding: 1px;
    width: 12px;
    height: 12px;
    border-width: 0 2px 2px 0px;
    transition: .4s;
}
.slider__info__image .thumb .slick-prev:hover:after,
.slider__info__image .thumb .slick-next:hover:after
{
    border-color: #000;
    transition: .4s;
}
.slider__info__image .thumb .slick-prev:after {
    right: 7px;
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
}
.slider__info__image .thumb .slick-next:after {
    right: 13px;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}
@media(max-width: 576px){
    .info__content .slider__info__image .thumb
    {
        padding: 0 34px;
    }
    .slider__info__image .thumb .slick-prev,
    .slider__info__image .thumb .slick-next
    {
        width: 24px;
        height: 25px;
        margin-top: -12px;
    }
    .slider__info__image .thumb .slick-prev:after,
    .slider__info__image .thumb .slick-next:after {
        margin-top: -5px;
        width: 10px;
        height: 10px;
    }
    .slider__info__image .thumb .slick-prev:after {
        right: 5px;
    }
    .slider__info__image .thumb .slick-next:after {
        right: 10px;
    }
    .detail-page .info__inner .wrap-btn{
        margin: 0px 0 35px 0;
    }
}
/* End slider =================================================*/
.info__content
{
    margin-bottom: 35px;
}
.info__content:last-child
{
    margin-bottom: 0;
}
.info__content .info__content_inner{
    display: block;
}
.info__content h2,
.info__content h3,
.info__content h4,
.info__content h5,
.info__content h6
{
    margin: 1.5rem 0;
    font-family: 'Noto Serif JP', 'Garamond Premier Pro', 'YuMincho Demibold', メイリオ, Meiryo, serif;
    line-height: 1.3;
    border-bottom: 1px solid #4C4948;
    padding-bottom: 10px;
    font-weight: 600;
}
.info__content h2
{
    font-size: 2rem;
}
.info__content h3
{
    font-size: 1.8rem;
}
.info__content h4
{
    font-size: 1.6rem;
}
.info__content h5,
.info__content h6
{
    font-size: 1.4rem;
}
.info__content strong
{
    font-family: 'Noto Serif JP', 'YuMincho Extrabold', メイリオ, Meiryo, serif;
}
.info__content ol,
.info__content ul
{
    margin: 0 0 1.2em 1.2em;
}
.info__content p
{
    margin-bottom: 0.2rem;
}
.info__content img
{
    max-width: 100% !important;
    height: auto !important;
}
.info__content pre {
  background: #eee;
  line-height: 1.6;
  margin-bottom: 1.6em;
  max-width: 100%;
  overflow: auto;
  padding: 1.6em;
}
.info__content blockquote {
    position: relative;
    padding: 20px 20px 20px 70px;
    margin-bottom: 20px;
    line-height: 2.0;
    border: 1px solid #efeff0;
    box-shadow: 0 3px 0 rgba(239,239,240,0.4);
}
.info__content blockquote::before {
    position: absolute;
    top: 20px;
    left: 20px;
    font-family: 'ＭＳ Ｐゴシック', sans-serif;
    font-size: 6rem;
    line-height: 1.0;
    color: #000;
    content: '“';
}
.info__content blockquote a
{
    color: #EB564B;
    word-break: break-all;
}
.info__content .alignleft {
    float: left;
    margin: 0.5em 1em 0.5em 0;
}
.info__content .alignright {
    float: right;
    margin: 0.5em 0 0.5em 1em;
}
.info__content .aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
/* sidebar ============================================== */
.detail-page .sidebar
{
    width: 350px;
    min-width: 350px;
    padding: 45px 0 0 45px;
}
.detail-page .sidebar .group
{
    margin-bottom: 70px;
}
.detail-page .sidebar .group:last-child
{
    margin-bottom: 0;
}
.detail-page .sidebar h2{
    font-size: 1.3rem;
    border-bottom: 1px solid #4C4948;
    line-height: 1.2;
    padding-bottom: 5px;
    margin-bottom: 10px;
}
.detail-page .sidebar ul
{
    margin: 0;
    padding: 0;
}
.detail-page .sidebar ul li{
    display: block;
    border-bottom: 1px solid #4C4948;
}
.detail-page .sidebar ul li .date{
    padding-right: 15px;
}
.detail-page .sidebar ul li a
{
    display: block;
    width: 100%;
    color: #000;
    padding: 15px 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
@media(max-width: 768px){
    .detail-page
    {
        padding: 60px 0 80px;
    }
    .detail-page .content-detail
    {
        flex: auto;
    }
    .detail-page .content-detail .info__inner,
    .detail-page.full .content-detail .info__inner{
        padding: 40px;
    }
    .detail-page .sidebar
    {
        width: 100%;
        min-width: 100%;
        padding: 45px 40px 0 40px;
    }
}
@media(max-width: 576px){
    .detail-page
    {
        padding: 50px 0 60px;
    }
    .detail-page .content-detail .info__inner{
        padding: 20px 20px 30px 20px;
    }
    .detail-page.full .content-detail .info__inner{
        padding: 35px 20px 30px 20px;
    }
    .detail-page h2.title
    {
        margin-bottom: 40px;
    }
    .detail-page .info__title
    {
        font-size: 2.1rem;
    }
    .detail-page.full .info__title
    {
        margin-top: 0px;
    }
    .info__content h2
    {
        font-size: 1.6rem;
    }
    .info__content h3
    {
        font-size: 1.4rem;
    }
    .info__content h4
    {
        font-size: 1.3rem;
    }
    .info__content h5,
    .info__content h6
    {
        font-size: 1.2rem;
    }
    .detail-page .sidebar
    {
        padding: 0;
        margin-top: 20px;
    }
    .detail-page .sidebar .group
    {
        margin-bottom: 40px;
    }
    .detail-page .sidebar ul li a
    {
        padding: 12px 0;
    }
    .detail-page .wrap-btn
    {
        margin: 35px 0 15px;
    }
}
@media(max-width: 480px){
    .detail-page .sidebar ul li a
    {
        padding: 10px 0;
    }
}
@media(max-width: 375px){
    .detail-page .info__title
    {
        font-size: 1.8rem;
    }
    .info__content h2
    {
        font-size: 1.4rem;
    }
    .info__content h3
    {
        font-size: 1.3rem;
    }
    .info__content h4
    {
        font-size: 1.2rem;
    }
    .info__content h5,
    .info__content h6
    {
        font-size: 1.1rem;
    }
}
/*
==============================================================
====================== End detail page =======================
==============================================================
*/
/*
==============================================================
=========================== select2 ==========================
==============================================================
*/
.select2-container {
    z-index: 300;
    width: 100% !important;
}
.control-select-full {
    width: 100%;
}
.select2-container--default .select2-selection--single {
    border-radius: 0;
    border: 1px solid #231815;
}
.select2-dropdown
{
    border: 1px solid #231815;
}
.select2-container .select2-selection--single {
    height: 50px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 50px !important;
    color: inherit;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder {
    position: relative;
    bottom: 1px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 50px;
    width: 40px;
    top: 0;
    right: 0;
    border: none;
    background: none;
    border-radius: 0;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b,
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
   /* border-color: #000 transparent transparent transparent;
    border-width: 8px 6px 0 6px;*/
    border-style: solid;
    display: inline-block;
    padding: 5px;
    width: 0;
    height: 0;
    border-color: #231815;
    margin-left: -8px;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}
.select2-container--default .select2-selection--single .select2-selection__arrow b
{
    border-width: 0 1px 1px 0px;
    margin-top: -7px;
}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-width: 1px 0px 0px 1px;
    margin-top: -3px;
}

.select2-container--default .select2-selection--single .select2-selection__clear {
    z-index: 100;
    position: absolute;
    right: 1px;
    bottom: 1px;
    top: 1px;
    width: 40px;
    background: #fff;
    text-align: center;
    color: #000;
    line-height: 46px;
    border-radius: 0;
    font-size: 1.2rem;
}
.select2-container--default .select2-search--dropdown .select2-search__field
{
    padding: 10px;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder
{
    color: #ccc;
}
.select2-container--default .select2-selection--multiple .select2-selection__rendered
{
    padding: 2px 5px;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice
{
    margin-top: 2px;
    margin-bottom: 2px;
}
/*
==============================================================
========================= End select2 ========================
==============================================================
*/
/*
==============================================================
============================ Header ==========================
==============================================================
*/
header{
    position: relative;
    z-index: 200;
}
header .header-top{
    position: absolute;
    z-index: 100;
    left: 0;
    top: 0;
    padding: 20px 0 0 20px;
    line-height: 1;
}
.home header .header-top{
    display: none;
}
header .header-top a{
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}
header .header-top a:hover
{
    opacity: 1;
    filter:alpha(opacity=100);
    -ms-filter: "alpha(opacity=100)";
}
header .header-top img{
    width: 198px;
}
header .home-logo{
    position: absolute;
    left: 0;
    right: 0;
    z-index: 5;
    text-align: center;
}
header .home-logo img{
    max-width: 748px;
    width: auto;
}
header #menu-toggle {
  display: none;
}
header #menu-toggle {
    position: absolute;
    right: 20px;
    top: 50%;
    margin-top: -12px;
    background: none;
    border: none;
    cursor: pointer;
}
header #menu-toggle .menu-bar > span {
    border-bottom: 2px solid #fff;
    margin-bottom: 9px;
    width: 36px;
    transition: 0.2s;
    display: block;
}
header #menu-toggle .menu-bar > span:nth-child(2) {
    transition: 0s;
}
header #menu-toggle .menu-bar > span:nth-child(3) {
    margin-bottom: 0;
}
header #menu-toggle.active
{
    right: 15px;
}
header #menu-toggle.active .menu-bar > span {
    width: 42px;
}
header #menu-toggle.active .menu-bar > span:nth-child(2) {
    opacity: 0;
}
header #menu-toggle.active .menu-bar > span:nth-child(1) {
    transform: translate3d(0px, 10px, 0) rotate(45deg);
}
header #menu-toggle.active .menu-bar > span:nth-child(3) {
    transform: translate3d(0px, -13px, 0) rotate(-45deg);
}
@keyframes aniFixedHeader
{
    0%
    {
        height: 0;
        opacity: 0;
    }
    100%
    {
        height: 66px;
        opacity: 1;
    }
}
@media(max-width: 1200px){
    header .home-logo img{
        max-width: 50%;
    }
}
@media(max-width: 1024px){
    header .home-logo img{
        max-width: 50%;
    }
}
@media(max-width: 768px){
    header .header-top{
        position: fixed;
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: -webkit-flex !important;
        display: flex !important;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
        padding: 0px 20px;
        right: 0;
        height: 66px;
    }
    .fixed header .header-top{
        background: #222222;
        animation: aniFixedHeader 1 linear 0.2s;
    }
    .home header .header-top a{
        display: none;
    }
    .home header .header-top.show a,
    .home.fixed header .header-top a{
        display: block;
        padding-top: 7px;
    }
    header #menu-toggle {
      display: block;
    }
}
@media(max-width: 375px){
    header .header-top img{
        width: 155px;
    }
}
/* sidebar ================================================== */
header .sidebar{
    position: absolute;
    right: 60px;
    top: 45px;
    z-index: 4;
    background: url('../img/bg-language.png') no-repeat;
    background-position: top center;
    text-align: center;
    padding-top: 52px;
    width: 100px;
}
header .language{
    display: block;
}
header .language a{
    display: inline-block;
    text-transform: uppercase;
    display: block;
    line-height: 1;
    margin-bottom: 25px;
    color: #fff;
}
header .language a:last-child{
    margin-bottom: 0;
}
header .sign-in
{
    line-height: 1;
    margin-top: 28px;
}
header .sign-in a
{
    color: #000;
    font-size: 1.25rem;
}
[lang="es"] header .sign-in a{
    font-size: 1.1rem;
}
header .sidebar .sign-in a
{
    display: inline-block;
}
header .sidebar .sign-in a:hover
{
    opacity: 1;
}
header .sidebar .sign-in a span{
    width: 100px;
    height: 100px;
    border-radius: 100%;
    background: #fff;
    border: 1px solid #858485;
    background: url('../img/ic-user-login.png') no-repeat;
    background-color: #fff;
    background-position: center 25px;
    padding-top: 52px;
    display: block;
    transition: .4s;
}
header .sidebar .sign-in a:hover span{
    background: url('../img/ic-user-login-white.png') no-repeat;
    background-position: center 25px;
    background-color: #000;
    color: #fff;
    /* animation: aniFadeButton 1 linear 0.4s; */
    transition: .4s;
}
header .sign-in.sp
{
    display: none;
}
@media(max-width: 1100px){
    header .sidebar
    {
        top: unset;
        bottom: 45px;
    }
    .home header .sidebar
    {
        top: 45px;
        bottom: unset;
    }
}
@media(max-width: 960px){
    header .sidebar
    {
        top: unset;
        bottom: 15px;
        right: 35px;
        padding-top: 52px;
        background-size: 84px 43px;
    }
    .home header .sidebar
    {
        top: 25px;
        bottom: unset;
    }
    header .sidebar .sign-in a
    {
        font-size: 1.15rem;
    }
    header .sidebar .sign-in a span{
        width: 84px;
        height: 84px;

        padding-top: 45px;
    }
    header .sidebar .sign-in a span,
    header .sidebar .sign-in a:hover span
    {
        background-position: center 18px;
    }
    [lang="es"] header .sign-in a{
        font-size: 1rem;
    }
}
@media(max-width: 768px){
    header .sidebar
    {
        width: 74px;
        background-size: 74px 38px;
        top: 95px !important;
        right: 37px;
        bottom: unset;
    }
    header .sidebar .sign-in{
        display: none;
    }
    header .sign-in.sp
    {
        width: 100%;
        padding: 0 38px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
    }
    header .sign-in.sp a{
        background: #fff;
        width: 300px;
        height: 56px;
        border-radius: 28px;
        font-size: 1.25rem;
        padding: 0;
        margin-top: 30px;
    }
    header .sign-in.sp a span{
        display: inline-block;
        background: #fff url('../img/ic-user-login.png') no-repeat;
        background-position: left center;
        padding: 6px 0 6px 26px;
    }
    header .sign-in.sp a:hover
    {
        opacity: 1;
        background-color: #000;
        color: #fff;
        animation: aniFadeButton 1 linear 0.4s;
        border: 1px solid #858485;
    }
    header .sign-in.sp a:hover span{
        background: url('../img/ic-user-login-white.png') no-repeat;
        background-position: left center;
    }
}
@media(max-width: 428px){
    header .sign-in.sp a{
        width: 100%;
    }
}
/* Main visual ================================================== */
.main-visual {
    position: relative;
    display: inline-block;
    width: 100%;
    z-index: 1;
    height: 100vh;
}
.main-visual ul {
    margin: 0;
    padding: 0;
}
.main-visual li {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  height: 100vh;
  margin: 0;
  text-decoration: none;
}
.main-visual li.img01 {
    background-image: url('../img/sliders/slider01.jpg?v=20230926');
}
.main-visual li.img02 {
    background-image: url('../img/sliders/slider02.jpg');
}
.main-visual li.img03 {
    background-image: url('../img/sliders/slider03.jpg?v=20230928');
}
.main-visual ul li img {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}
.slick-slider-dots{
    position:  absolute;
    left: 84px;
    bottom: 40px;
    z-index: 11;
}
.slick-slider-dots .slick-dots,
.slick-slider-dots .slick-dots li{
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    padding: 0px 3px;
}
.slick-slider-dots .slick-dots button{
    line-height: 1;
    padding: 0;
    margin: 0;
    width: 12px;
    height: 12px;
    background: none !important;
    border: medium none;
    cursor: pointer;
    overflow: hidden;
    color: #CFCFCF;
    font-size: 0px;
    position: relative;
}
.slick-slider-dots .slick-dots button:before{
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 6px;
    border-bottom: 1px solid #CFCFCF;
}
.slick-slider-dots .slick-active button:before{
    border-bottom: 1px solid #fff;
}
@media(max-width: 1100px){
    .slick-slider-dots{
        left: 20px;
    }
}
@media(max-width: 960px){
    .slick-slider-dots{
        bottom: 10px;
    }
}
/* Menu ================================================== */
@keyframes headerMenu {
  0% {
    opacity: 0.5;
  }
  100% {
    opacity: 1;
  }
}
@keyframes aniMainMenuPC
{
    0%
    {
        top: -60px;
    }
    100%
    {
        top: 0;
    }
}
header .wrapper-nav{
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 5;
    animation: headerMenu 0.2s linear;
}
header .main-nav{
    position: absolute;
    z-index: 5;
    left: 0;
    right: 0;
    top: 0;
    padding-top: 34px;
}
.home header .main-nav
{
    top: unset;
    bottom: 0;
    padding-top: 0;
    padding-bottom: 25px;
}
.main-nav ul li{
    display: inline-block;
}
.main-nav ul li a{
    color: #fff;
    display: inline-block;
    padding: 10px 25px;
    font-size: 1.125rem;
    position: relative;
    line-height: 1.3;
}
.main-nav ul li:hover a:before,
.main-nav ul li.active a:before{
    content: '';
    position: absolute;
    left: 50%;
    margin-left: -2px;
    top: 6px;
    width: 4px;
    height: 4px;
    border-radius: 100%;
    background: #fff;
}
.fixed header .wrapper-nav
{
    z-index: 25;
}
.fixed header .main-nav{
    position: fixed;
    left: 0;
    right: 0;
    bottom: unset;
    top: 0;
    background: #222222;
    padding-bottom: 0;
    padding-top: 0;
    animation: aniMainMenuPC 1 linear 0.2s;
}
.fixed header .main-nav li{
    color: #fff;
    padding-top: 7px;
    padding-bottom: 7px;
}
.fixed header .main-nav a{
    color: #fff;
}
@media only screen and (max-width: 1300px) and (min-width: 1101px)  {
    [lang="fr"] header .sidebar,
    [lang="es"] header .sidebar{
        top: 110px;
    }
}
@media only screen and (max-width: 1160px) and (min-width: 769px)  {
    [lang="fr"] .main-nav ul,
    [lang="es"] .main-nav ul{
        flex-wrap: wrap;
    }
    [lang="fr"] .main-nav ul li a,
    [lang="es"] .main-nav ul li a{
        padding-left: 15px;
        padding-right: 15px;
    }
}
@media only screen and (max-width: 961px) and (min-width: 769px)  {
    [lang="fr"] header.solid,
    [lang="es"] header.solid{
        height: 200px;
    }
}
@media(max-width: 1200px){
    header .main-nav{
        padding-top: 50px;
    }
}
@media(max-width: 1024px){
    .main-nav ul li a{
        padding: 10px 20px;
    }
}
@media(max-width: 960px){
    .main-nav ul li a{
        padding: 10px 15px;
    }
}
@media(max-width: 768px){
    .fixed header .main-nav
    {
        position: unset;
        background: none;
    }
    header .wrapper-nav{
        position: fixed;
        background: #222222;
        display: none;
        overflow-y: auto;
        z-index: 22;
    }
    header .wrapper-nav.active{
        display: block;
    }
    header .wrapper-nav .container{
        padding-left: 35px;
        padding-right: 0px;
    }
    header .main-nav
    {
        position: unset;
        padding-top: 95px !important;
        padding-bottom: 0 !important;
        padding-right: 110px;
    }
    header .main-nav ul{
        display: inline-block;
        width: 100%;
        border-left: 1px solid #fff;
    }
    header .main-nav li
    {
        display: inline-block;
        width: 100%;
    }
    header .main-nav li a{
        padding: 10px 10px;
        display: block;
    }
    .main-nav ul li:hover a:before,
    .main-nav ul li.active a:before{
        width: 0;
        height: 0;
        background: transparent;
    }
}
@media(max-width: 375px){
    [lang="fr"] header .wrapper-nav .container,
    [lang="es"] header .wrapper-nav .container{
        padding-left: 25px;
    }
    [lang="fr"] header .sidebar,
    [lang="es"] header .sidebar{
        right: 27px;
    }
}
/* Banner ================================================== */
header .banner{
    width: 100%;
}
header .banner img{
    width:  100%;
    object-fit: cover;
}
header .banner-title{
    position: absolute;
    left: 0;
    right: 0;
    z-index: 3;
    color: #fff;
    text-align: center;
    font-size: 4.375rem;
    line-height: 1;
    padding: 20px 150px;
    overflow: hidden;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
@media(max-width: 1100px){
    header .banner img{
        height: 400px;
    }
}
@media(max-width: 960px){
    header .banner img{
        height: 350px;
    }
}
@media(max-width: 768px){
    header .banner-title{
        font-size: 3rem;
        padding: 0 20px;
    }
    header .banner img{
        height: 300px;
    }
}
@media(max-width: 576px){
    header .banner-title{
        font-size: 2.5rem;
        line-height: 1.2;
        white-space: unset;
        overflow: hidden;
    }
}
@media(max-width: 414px){
    header .banner img{
        height: 280px;
    }
}
@media(max-width: 375px){
    header .banner img{
        height: 260px;
    }
}
/*
==============================================================
========================= End header =========================
==============================================================
*/
/*
==============================================================
=========================== Contact ==========================
==============================================================
*/
.group-contact
{
    display: inline-block;
    width: 100%;
    background-image: url('../img/bg-contact.png');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    padding: 100px 0;
    border-top: 1px solid #251714;
    position: relative;
    z-index: 105;
}
.group-contact:before{
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: -10px;
    border-top: 1px solid #251714;
}
.group-contact .txt
{
    display: inline-block;
    text-align: center;
    padding-right: 62px;
}
.group-contact .txt span{
    display: block;
    font-size: 4.3rem;
    line-height: 1.1;
}
.group-contact .txt span.small{
    font-size: 1rem;
    line-height: 1.2;
}
.group-contact .wrap-btn{
    padding-left: 62px;
}
.inp-pd
{
    display: inline-block;
    width: 100%;
    padding: 0 5px;
}
@media(max-width: 767px){
    .group-contact
    {
        padding: 50px 0;
    }
    .group-contact .inner,
    .group-contact .txt,
    .group-contact .wrap-btn
    {
        display: inline-block !important;
        width: 100%;
        text-align: center;
    }
    .group-contact .txt
    {
        padding-right: 0px;
        margin-bottom: 20px;
    }
    .group-contact .wrap-btn{
        padding-left: 0px;
    }
}
@media(max-width: 576px){
    .group-contact
    {
        padding: 40px 0;
    }
    .group-contact .txt span{
        font-size: 3.7rem;
    }
}
/*
==============================================================
======================== End Contact =========================
==============================================================
*/
/*
==============================================================
=========================== Footer ===========================
==============================================================
*/
footer{
    background: #000;
    color: #fff;
    padding: 80px 0px 20px;
    text-align: center;
}
footer a{
    color: #fff;
}
footer .logo{
    text-align: center;
}
footer .logo a{
    display: block;
}
footer .logo a:hover
{
    opacity: 1;
    filter:alpha(opacity=100);
    -ms-filter: "alpha(opacity=100)";
}
footer .logo img{
    max-width: 637px;
}
footer .large{
    font-size: 1.9rem;
    margin: 25px 0;
    line-height: 1.3;
}
footer .wrap-btn{
    text-align: center;
    margin: 20px 0;
}
footer .follow
{
    display: inline-block;
    width: 100%;
    font-size: 1.18rem;
    margin: 15px 0;
}
footer .follow a{
    display: inherit;
}
footer .follow .txt{
    padding-right: 15px;
}
footer .follow a{
    padding-left: 15px;
}
footer .footer-nav{
    border-top: 1px solid #B0B1B2;
    border-bottom: 1px solid #B0B1B2;
    padding: 10px 0;
    margin: 15px 0;
}
footer .bottom{
    display: inline-block;
    width: 100%;
}
footer .bottom .link{
    float: left;
    position: relative;
    bottom: 5px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}
footer .bottom .link a{
    font-size: 0.93rem;
    margin-right: 25px;
}
footer .bottom .link a:last-child{
    margin-right: 0;
}
footer .copy-right
{
    float: right;
    font-size: 0.75rem;
}
.scrollup {
    color: #fff;
    width: 50px;
    height: 50px;
    text-align: center;
    line-height: 70px;
    display: inline-block;
    bottom: 35px;
    right: 40px;
    position: fixed;
    z-index: 1000;
    cursor: pointer;
    display: none;
    border: 1px solid #fff;
    background: #000000;
    border-radius: 100%;
}
.scrollup i {
    position: absolute;
    left: 15px;
    top: 20px;
    border-color: #fff;
    border-width: 0 1px 1px 0px;
    border-style: solid;
    display: inline-block;
    padding: 4px;
    width: 18px;
    height: 18px;
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
}
@media(max-width: 1024px){
    footer .logo img{
        max-width: 60%;
    }
}
@media (max-width: 960px) {
    footer .logo img{
        max-width: 70%;
    }
}
@media (max-width: 768px) {
    .scrollup {
        right: 5px;
        bottom: 30px;
    }
}
@media (max-width: 767px) {
    footer .footer-nav ul,
    footer .footer-nav ul li{
        display: inline-block;
        width:  100%;
        position: relative;
    }
    footer .footer-nav ul li a
    {
        padding: 8px 0;
    }
    footer .bottom .link,
    footer .bottom .copy-right
    {
        float: none;
        display: inline-block;
        width:  100%;
    }
    footer .large
    {
        font-size: 1.8rem;
    }
}
@media (max-width: 576px) {
    footer{
        padding-top: 50px;
    }
    footer .large
    {
        font-size: 1.7rem;
        margin: 20px 0 15px 0;
    }
    footer .follow
    {
        margin: 5px 0;
    }
    footer .copy-right
    {
        font-size: 0.65rem;
        line-height: 1.5;
    }
}
@media (max-width: 480px) {
    footer .large
    {
        font-size: 1.4rem;
    }
}
@media (max-width: 428px) {
    footer .small br{
        display: none;
    }
}
@media (max-width: 320px) {
    footer .copy-right
    {
        font-size: 0.55rem;
    }
}
/*
==============================================================
========================= End footer =========================
==============================================================
*/
/*
==========================================================================
================================= Home page ==============================
==========================================================================
*/
/*
==============================================================
============================ intro ===========================
==============================================================
*/
.home .intro
{
    display: inline-block;
    width: 100%;
    padding-bottom: 100px;
    background: rgb(187,210,216);
    background: -moz-linear-gradient(240deg, rgba(187,210,216,1) 0%, rgba(199,218,223,1) 8%, rgba(235,241,243,1) 27%, rgba(235,241,243,1) 100%);
    background: -webkit-linear-gradient(240deg, rgba(187,210,216,1) 0%, rgba(199,218,223,1) 8%, rgba(235,241,243,1) 27%, rgba(235,241,243,1) 100%);
    background: linear-gradient(240deg, rgba(187,210,216,1) 0%, rgba(199,218,223,1) 8%, rgba(235,241,243,1) 27%, rgba(235,241,243,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#bbd2d8",endColorstr="#ebf1f3",GradientType=1);
    position: relative;
}
.home .intro .title{
    display: inline-block;
    width: 100%;
    padding-top: 90px;
    padding-bottom: 55px;
}
.home .intro .title:before{
    bottom: -70%;
}
.home .intro .items{
    position: relative;
    z-index: 3;
    flex-wrap: wrap;
}
.home .intro .item:first-child
{
    width: 44%;
}
.home .intro .item:last-child
{
    width: 56%;
    padding-left: 65px;
}
.wrapper-video {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
}
.wrapper-video iframe {
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
}
@media(max-width: 960px){
    .home .intro .item:last-child
    {
        padding-left: 30px;
    }
}
@media(max-width: 768px){
    .home .intro
    {
        padding-bottom: 50px;
    }
    .home .intro .items
    {
        display: inline-block;
        width: 100%;
    }
    .home .intro .item:first-child,
    .home .intro .item:last-child
    {
        width: 100%;
    }
    .home .intro .item:last-child
    {
        padding-left: 0;
        margin-top: 30px;
    }
    .home .intro .title{
        padding-top: 70px;
        padding-bottom: 35px;
    }
    .home .intro .title:before{
        bottom: -40%;
    }
}
@media(max-width: 576px){
    .home .intro .title{
        padding-top: 60px;
        padding-bottom: 30px;
    }
}
@media(max-width: 428px){
    .home .intro {
        padding-bottom: 50px;
    }
    .home .intro .title{
        padding-top: 50px;
        padding-bottom: 25px;
    }
    .home .intro .item:last-child
    {
        margin-top: 25px;
    }
}
/*
==============================================================
========================= Our thoughts =======================
==============================================================
*/
.home .our-thoughts
{
    display: inline-block;
    width: 100%;
    background-image: url('../img/home/bg-our-thoughts.jpg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    padding: 160px 0;
    position: relative;
    color: #fff;
    z-index: 2;
}
.home .intro .text-desc
{
    right: -50px;
    bottom: 92px;
    z-index: 1;
    top: unset;
}
.home .our-thoughts h2{
    /*font-size: 4.625rem;*/
    font-size: 3.5rem;
    line-height: 1.2;
    margin-bottom: 20px;
}
.home .our-thoughts .top{
    display: inline-block;
    width: 100%;
    text-align: center;
    margin-bottom: 180px;
}
.home .our-thoughts .top .wrap-btn{
    margin-top: 30px;
}
.home .our-thoughts .items .item{
    width: 50%;
}
.home .our-thoughts .items .item:first-child{
    padding-right: 114px;
}
.home .our-thoughts .items .item:last-child{
    padding-left: 114px;
    padding-top: 70px;
}
.home .our-thoughts .items .item .img{
    margin-top: 25px;
}
.home .our-thoughts .items .item img{
    width: 100%;
}
.home .our-thoughts .items .item .btn{
    margin-top: 18px;
}
@media(max-width: 1366px){
    .home .intro .text-desc
    {
        right: -90px;
    }
}
@media(max-width: 1180px){
    .home .intro .text-desc
    {
        display: none;
    }
}
@media(max-width: 1024px){
    .home .our-thoughts .items .item:first-child{
        padding-right: 70px;
    }
    .home .our-thoughts .items .item:last-child{
        padding-left: 70px;
    }
}
@media(max-width: 960px){
    .home .our-thoughts
    {
        padding: 100px 0;
    }
    .home .our-thoughts .top{
        margin-bottom: 100px;
    }
    .home .our-thoughts h2{
        font-size: 3rem;
    }
    .home .our-thoughts .items .item:first-child{
        padding-right: 20px;
    }
    .home .our-thoughts .items .item:last-child{
        padding-left: 20px;
    }
}
@media(max-width: 768px){
    .home .our-thoughts h2{
        font-size: 2.8rem;
    }
}
@media(max-width: 767px){
    .home .our-thoughts
    {
        padding: 70px 0;
    }
    .home .our-thoughts .top{
        margin-bottom: 70px;
    }
    .home .our-thoughts .items .item{
        width: 100%;
        margin-bottom: 60px;
    }
    .home .our-thoughts .items .item:last-child{
        margin-bottom: 0;
    }
    .home .our-thoughts .items .item:first-child{
        padding-right: 0px;
    }
    .home .our-thoughts .items .item:last-child{
        padding-left: 0px;
        padding-top: 0;
    }
    .home .our-thoughts .btn{
        text-align: center !important;
    }
}
@media(max-width: 480px){
    .home .our-thoughts h2{
        font-size: 2.6rem;
    }
}
@media(max-width: 414px){
    .home .our-thoughts h2{
        font-size: 2.6rem;
    }
}
@media(max-width: 320px){
    .home .our-thoughts h2{
        font-size: 2.4rem;
    }
}
/*
==============================================================
======================= End our thoughts =====================
==============================================================
*/
/*
==============================================================
============================ Product =========================
==============================================================
*/
.home .product
{
    padding-bottom: 100px;
    background: url('../img/bg-group.png');
}
.home .product .bg-content
{
    padding-left: 0;
}
.home .product .bg-content:before{
    left: -28px;
}
.home .product .text-desc
{
    left: 0;
    top: -90px;
    padding-right: 0;
    padding-left: 122px;
    transform: rotate(-90deg);
}
.home .product .text-desc::before
{
    right: unset;
    left: 0;
}
.home .product .item{
    display: inline-block;
    width: 100%;
    position: relative;
}
.home .product .item .content{
    position: relative;
    padding-bottom: 160px;
}
.home .product .item.odd .content
{
    padding-bottom: 0;
}
.home .product .item .wrap-btn{
    margin-top: 40px;
}
.home .product .even{
    background: url('../img/home/product-img01.jpg');
    background-repeat: no-repeat;
    background-position: right 100px;
    background-size: 27%;
}
.home .product .bg-content::before
{
    bottom: 0;
    background: url('../img/bg-title1.png') no-repeat;
}
.home .product .even .bg-content {
    padding-right: 150px;
}
.home .product .even h2{
    padding-top: 170px;
}
.home .product .even .img
{
    position: absolute;
    right: -60px;
    bottom: -45px;
}
.home .product .odd .inner{
    display: block;
    padding-left: 46.3%;
}
.home .product .odd{
    background: url('../img/home/product-img03.jpg');
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 40%;
}
/*@keyframes aniImageLeft {
  0% {
      background-position: -100%;

  }
  100% {
    background-size: left top;
  }
}*/
.home .product .odd{
    margin-top: 100px;
}
.home .product .odd .bg-content
{
    margin-top: 68px;
}
.home .product .odd h2{
    padding-top: 70px;
}
.home .product .odd .wrap-btn{
    text-align: right;
}
.home .product .odd .img{
    display: none;
}
@media(max-width: 1440px){
    .home .product .even .bg-content {
        padding-right: 250px;
    }
    .home .product .even .img
    {
        right: -95px;
    }
    .home .product .even .img img
    {
        width: 420px;
    }
    .home .product .item .content{
        padding-bottom: 110px;
    }
}
@media(max-width: 1366px){
    .home .product .even .bg-content {
        padding-right: 270px;
    }
    .home .product .item .content{
        padding-bottom: 110px;
    }
    .home .product .text-desc
    {
        left: -20px;
    }
}
@media(max-width: 1200px){
    .home .product .even .bg-content {
        padding-right: 310px;
    }
    .home .product .even .img
    {
        bottom: -25px;
    }
    .home .product .even .img img
    {
        width: 350px;
    }
    .home .product .item .content{
        padding-bottom: 50px;
    }
    .home .product .text-desc
    {
        left: -65px;
    }
}
@media(max-width: 1100px){
    .home .product .text-desc
    {
        left: -78px;
    }
}
@media(max-width: 1024px){
    .home .product .even .bg-content {
        padding-right: 290px;
    }
    .home .product h2{
        font-size: 2.5rem;
    }
    .home .product .even .img
    {
        bottom: 0px;
    }
    .home .product .even .img img
    {
        width: 300px;
    }
    .home .product .odd
    {
        margin-top: 40px;
    }
    .home .product .text-desc
    {
        display: none;
    }
}
@media(max-width: 960px){
    .home .product .even .bg-content {
        padding-right: 250px;
    }
    .home .product .even{
        background-size: 28%;
    }
    .home .product .even .img
    {
        bottom: 0px;
    }
}
@media(max-width: 959px){
    .home .product .even {
        background: none;
    }
    .home .product .even .bg-content
    {
        padding-right: 0;
    }
    .home .product .even .img
    {
        right: 0;
    }
    .home .product .even h2
    {
        padding-top: 70px;
    }
}
@media(max-width: 768px){
    .home .product
    {
        padding-bottom: 60px;
    }
    .home .product .bg-content
    {
        padding-right: 0px !important;
    }
    .home .product .item .content
    {
        padding-bottom: 0;
    }
    .home .product .item .wrap-btn
    {
        margin-top: 26px;
    }
    .home .product .even .img,
    .home .product .odd .img
    {
        position: unset;
        margin-top: 30px;
        display: inline-block;
        width: 100%;
        text-align: center;
    }
    .home .product .even .img img,
    .home .product .odd .img img
    {
        width: 100%;
    }
    .home .product .odd .inner{
        padding-left: 0;
    }
    .home .product .odd
    {
        background: none;
        margin-top: 0;
    }
    .home .product .odd .bg-content
    {
        margin-top: 0;
    }
}
@media(max-width: 576px){
    .home .product
    {
        padding-bottom: 50px;
    }
    .home .product h2{
        font-size: 2rem;
    }
    .home .product .even h2,
    .home .product .odd h2
    {
        padding-top: 50px;
    }
    .home .product .bg-content .note
    {
        bottom: 2px;
    }
}
@media(max-width: 480px){
    .home .product h2{
        font-size: 1.7rem;
    }
}
@media(max-width: 375px){
    .home .product
    {
        padding-bottom: 40px;
    }
    .home .product .even h2,
    .home .product .odd h2
    {
        padding-top: 45px;
    }
}
@media(max-width: 320px){
    .home .product h2{
        font-size: 1.4rem;
    }
}
/*
==============================================================
========================== End Product =======================
==============================================================
*/
/*
==============================================================
============================== News ==========================
==============================================================
*/
.home .news
{
    padding-bottom: 110px;
    background: url('../img/bg-group.png');
}
.home .news .inner{
    display: block;
    background: #E0EAEE;
}
.home .news .container{
    padding-top: 50px;
    padding-bottom: 50px;
}
.home .news h2{
    font-size: 4.3rem;
    line-height: 1;
    width: 290px;
    padding-right: 10px;
}
.home .news .items{
    position: relative;
    flex-wrap: wrap;
}
.home .news .articles{
    flex: 1;
}
.home .news .view-more{
    position: absolute;
    bottom: 0;
    right: 20px;
    background: #fff;
    width: 124px;
    height: 40px;
    line-height: 40px;
    font-size: 1.18rem;
    text-align: center;
    color: #000;
}
[lang="fr"] .home .news h2,
[lang="es"] .home .news h2{
    width: 390px;
}
@media(max-width: 960px){
    .home .news
    {
        padding-bottom: 70px;
    }
    .home .news h2{
        width: 210px;
    }
    .home .news .item a .date{
        width: 125px;
        min-width: 125px;
    }
}
@media(max-width: 768px){
    [lang="fr"] .home .news h2,
    [lang="es"] .home .news h2{
        width: 100%;
        padding-right: 0;
        text-align: center;
    }
}
@media(max-width: 576px){
    .home .news
    {
        padding-bottom: 50px;
    }
    .home .news h2{
        width: 100%;
        text-align: center;
        padding-bottom: 10px;
        font-size: 3.7rem;
    }
    .home .news .item a .date{
        width: 115px;
        min-width: 115px;
    }
}
/*
==============================================================
=========================== End news =========================
==============================================================
*/
/*
==========================================================================
============================== End Home page =============================
==========================================================================
*/
/*
==========================================================================
================================ news page ===============================
==========================================================================
*/
.news-page
{
    padding: 100px 0;
}
.news-page .articles
{
    background: #EBF2F3;
    padding: 45px 150px;
}
.news-page .pagination ul
{
    margin-top: 5px;
}
@media(max-width: 768px){
    .news-page
    {
        padding: 60px 0;
    }
    .news-page .articles
    {
        padding: 20px 20px;
    }
}
@media(max-width: 576px){
    .news-page
    {
        padding: 50px 0;
    }
    .news-page .articles
    {
        padding: 0px 20px;
    }
}
/*
==========================================================================
============================= End news page ==============================
==========================================================================
*/
/*
==========================================================================
============================= About sake page ============================
==========================================================================
*/
.about-sake-page h2.title{
    margin-bottom: 82px;
}
.about-sake-page .group1{
    display: block;
    padding-bottom: 170px;
}
.about-sake-page .block
{
    display: inline-block;
    width: 100%;
    padding: 80px 0;
}
.about-sake-page .bg-separator
{
    width: 100%;
    position: relative;
    overflow: hidden;
}
.about-sake-page .bg-separator img
{
    width: 69%;
    position: relative;
}
.bg-separator .left{
    transform: translate3d(-100%,0,0);
}
.bg-separator .right{
    transform: translate3d(100%,0,0);
}
.about-sake-page .items
{
    -webkit-box-align: flex-start;
    -ms-flex-align: flex-start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
}
.about-sake-page .items .item.item-img{
    position: relative;
    z-index: 5;
    padding-top: 115px;
}
.about-sake-page .items .item.item-img.sp{
    display: none;
}
.about-sake-page .items .item.item-img img{
    width: 100%;
}
.about-sake-page .items .item
{
    position: relative;
}

/* block1 ======================================= */
.about-sake-page .block1{
    padding-bottom: 100px;
}
.about-sake-page .block1 .content:after{
    right: -112px;
}
/* block2 ======================================= */
.about-sake-page .block2
{
    margin-top: 15px;
    padding-bottom: 68px;
}
.about-sake-page .block2 h2.title{
    padding-left: calc(44% + 75px);
}
.about-sake-page .block2 .item.item-img{
    width: 44%;
}
.about-sake-page .block2 .content{
    width: 56%;
}
.about-sake-page .block2 .content::before
{
    left: 90px;
}
.about-sake-page .block2 .content:after{
    left: -160px;
}
.about-sake-page .block2 .item .inner
{
    padding-left: 140px;
}
.about-sake-page h2.title.bg1 span,
.about-sake-page h2.title.bg2 span
{
    padding-left: 60px;
    padding-right: 60px;
}
@media(max-width: 768px){
    .about-sake-page .group1{
        padding-bottom: 80px;
    }
    .about-sake-page .block .content
    {
        padding-right: 0 !important;
    }
    .about-sake-page .group1 .items
    {
        background: #EFF4F5;
        padding-bottom: 50px;
    }
    .about-sake-page .items .item
    {
        width: 100% !important;
    }
    .about-sake-page .items .content:before{
        bottom: 40px;
    }
    .about-sake-page .items .content:after{
        left: 0 !important;
        right: 0 !important;
        background: none !important;
    }
    .about-sake-page .items .item.item-img
    {
        padding-top: 0;
        display: inline-block;
        width: 100%;
        text-align: center;
    }
    .about-sake-page .items .item.item-img img{
        width: auto;
        max-width: 100%;
        display: inline-block;
    }
    .about-sake-page .items .item .inner
    {
        padding-top: 50px;
        padding-bottom: 50px;
    }
    .about-sake-page .block.block1
    {
        padding-bottom: 55px;
    }
    .about-sake-page .bg-separator img{
        width: 100%;
    }
    .about-sake-page .block2
    {
        margin-top: 0;
    }
    .about-sake-page .block2 h2.title
    {
        padding-left: 0;
    }
    .about-sake-page .items .item.item-img.pc{
        display: none;
    }
    .about-sake-page .block2 .item.item-img.sp{
        display: inline-block;
    }
    .about-sake-page .block2 .item .inner {
        padding-left: 116px;
    }
    .about-sake-page .block2 .content::before {
        left: 58px;
    }
}
@media(max-width: 576px){
    .about-sake-page .block1,
    .about-sake-page .block2
    {
        padding-top: 40px;
    }
    .about-sake-page .group1
    {
        padding-bottom: 50px;
    }
    .about-sake-page .group1 .items
    {
        padding-bottom: 32px;
    }
    .about-sake-page .block.block1,
    .about-sake-page .block2
    {
        padding-bottom: 35px;
    }
    .about-sake-page .items .content:before{
        top: -25px;
        left: 35px;
        background: none;
    }
    .about-sake-page h2.title
    {
        margin-bottom: 20px;
    }
    .about-sake-page .items .item .inner
    {
        padding: 30px 20px;
    }
    .about-sake-page .block1 h2.title,
    .about-sake-page .block2 h2.title
    {
        margin-top: 10px;
    }
    .about-sake-page h2.title.bg1 span,
    .about-sake-page h2.title.bg2 span
    {
        padding: 7px 0px 3px 15px;
    }
}
/* group 2 ============================================== */
.group2{
    position: relative;
}
.group2:before{
    content: '';
    position: absolute;
    left: 0;
    top: 540px;
    bottom: 0;
    width: calc(100% - 1200px);
    background: url('../img/about-sake/about-sake-img07.jpg');
    background-repeat: no-repeat;
    background-size: 50%;
    pointer-events: none;
}
.about-sake-page .block3
{
    background: url('../img/about-sake/about-sake-img05.jpg');
    background-repeat: no-repeat;
    background-position: right bottom 50%;
    background-size: 35.5%;
}
.about-sake-page .block3 .items
{
    -webkit-box-align: flex-end;
    -ms-flex-align: flex-end;
    -webkit-align-items: flex-end;
    align-items: flex-end;
}
.about-sake-page .block3 h2.title{
    margin-bottom: 64px;
}
.about-sake-page .block3 .item .inner{
    padding: 0 20px 40px 112px;
}
.about-sake-page .block3 .item.item-img{
    width: 37.5%;
    padding-top: 0;
}
.about-sake-page .block3 .content{
    width: 62.5%;
    padding-right: 20px;
}
.about-sake-page .block3 .content::before
{
    top: -25px;
    bottom: 165px;
    left: 60px;
}
.about-sake-page .block3 .content::after {
  background: none;
}
.about-sake-page .block3 .item .wrap-btn{
    margin-top: 50px;
}
@media(max-width: 1200px){
    .about-sake-page .block3{
        background-position: right bottom 45%;
    }
}
@media(max-width: 1100px){
    .about-sake-page .block3{
        background-position: right bottom 38%;
    }
}
@media(max-width: 1024px){
    .about-sake-page .block3{
        background-position: right bottom 34%;
    }
}
@media(max-width: 960px){
    .about-sake-page .block3{
        background-position: right bottom 32%;
    }
}
@media(max-width: 860px){
    .about-sake-page .block3{
        background-position: right bottom 25%;
    }
}
@media(max-width: 768px){
    .about-sake-page .block3
    {
        padding-top: 70px;
        padding-bottom: 25px;
    }
    .about-sake-page .block3{
        background: none;
    }
    .about-sake-page .block3 .item .inner
    {
        padding-right: 60px;
    }
}
@media(max-width: 576px){
    .about-sake-page .block3
    {
        padding-top: 55px;
    }
    .about-sake-page .block3 .item .inner
    {
        padding: 0 0 35px 0;
    }
    .about-sake-page .block3 h2.title
    {
        margin-bottom: 30px;
    }
    .about-sake-page .items .item.item-img
    {
        padding: 0 20px;
    }
    .about-sake-page .block3 .items .item.item-img
    {
        padding: 0;
    }
    .about-sake-page .block3 .item .wrap-btn{
        margin-top: 35px;
    }
}
/* Make sake ============================================== */
.about-sake-page .make-sake
{
    margin-top: 130px;
}
.about-sake-page .make-sake .container{
    max-width: 930px;
}
.about-sake-page .make-sake h2.title{
    text-align: center;
    margin-bottom: 45px;
}
.about-sake-page .make-sake .desc{
    text-align: center;
    display: inline-block;
    width: 100%;
    margin-bottom: 80px;
}
.about-sake-page .make-sake .desc .large{
    font-size: 1.18rem;
    font-weight: 700;
}
.about-sake-page .make-sake ul{
    display: inline-block;
    width: 100%;
    margin: 0;
    padding: 0;
    position: relative;
}
.about-sake-page .make-sake ul:before{
    content: '';
    position: absolute;
    left: 54px;
    top: 5px;
    bottom: 20px;
    width: 1px;
    background: #231815;
}
.about-sake-page .make-sake ul li{
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    margin-bottom: 40px;
}
.about-sake-page .make-sake ul li:last-child
{
    margin-bottom: 0;
}
.about-sake-page .make-sake ul li .num{
    font-size: 3rem;
    padding-right: 60px;
    padding-top: 3px;
    line-height: 1;
}
.about-sake-page .make-sake ul li .group{
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    position: relative;
}
.about-sake-page .make-sake ul li .txt{
    flex: 1;
    padding-right: 40px;
}
.about-sake-page .make-sake ul li .img
{
    width: 100px;
    min-width: 100px;
}
.about-sake-page .make-sake ul li .img span{
    width: 98px;
    height: 98px;
    background: #fff;
    border-radius: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
.about-sake-page .make-sake ul li .img span img{
    max-width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
}
@media(max-width: 1200px){
    .about-sake-page .make-sake
    {
        margin-top: 70px;
    }
}
@media(max-width: 768px){
    .about-sake-page .make-sake ul::before
    {
        bottom: 0;
    }
    .about-sake-page .make-sake
    {
        margin-top: 80px;
    }
}
@media(max-width: 576px){
    .about-sake-page .make-sake
    {
        margin-top: 50px;
    }
    .about-sake-page .make-sake ul::before
    {
        left: 45px;
    }
    .about-sake-page .make-sake ul li .num
    {
        padding-right: 46px;
    }
    .about-sake-page .make-sake h2.title{
        margin: 30px 0 20px;
    }
    .about-sake-page .make-sake .desc{
        margin-bottom: 50px;
    }
    .about-sake-page .make-sake .list::before {
        left: 45px;
    }
    .about-sake-page .block3 .items .item.img
    {
        padding-left: 0;
        padding-right: 0;
    }
}
@media(max-width: 480px){
    .about-sake-page .make-sake ul li .group
    {
        display: inline-block;
        width: 100%;
        padding-top: 100px;
    }
    .about-sake-page .make-sake ul li .group .txt{
        padding-right: 0px;
        margin-top: 10px;
    }
    .about-sake-page .make-sake ul li .group .img
    {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
    }
}
/* Multiple parallel fermentation ============================ */
.about-sake-page .bottom{
    display: inline-block;
    width: 100%;
    margin: 170px 0 200px;
}
.about-sake-page .bottom h2.title{
    text-align: center;
    margin-bottom: 30px;
}
.about-sake-page .bottom .container{
    max-width: 1030px;
}
.about-sake-page .bottom .desc{
    display: inline-block;
    width: 100%;
    text-align: center;
    margin-bottom: 60px;
}
.about-sake-page .bottom .img{
    text-align: center;
}
.about-sake-page .bottom .img img{
    width:  100%;
}
@media(max-width: 768px){
    .about-sake-page .bottom
    {
        margin-top: 90px;
        margin-bottom: 120px;
    }
}
@media(max-width: 576px){
    .about-sake-page .bottom
    {
        margin-bottom: 85px;
    }
    .about-sake-page .bottom h2.title{
        margin-bottom: 25px;
    }
    .about-sake-page .bottom .desc
    {
        margin-bottom: 30px;
    }
    .about-sake-page .bottom .img{
        width: 820px;
    }
}
@media(max-width: 428px){
    .about-sake-page .bottom
    {
        margin-bottom: 60px;
        margin-top: 70px;
    }
}
/*
==========================================================================
============================ End About sake page =========================
==========================================================================
*/
/*
==========================================================================
============================ Types of sake page ==========================
==========================================================================
*/
/* block 1, block 2 ============================================== */
.type-of-sake-page .intro
{
    padding-bottom: 55px;
}
.type-of-sake-page .intro .content .inner
{
    padding-right: 35px;
}
.type-of-sake-page .rice-polishing-ratio
{
    padding: 85px 0 0px;
}
.type-of-sake-page .rice-polishing-ratio .content .inner{
    padding-right: 140px;
    padding-bottom: 55px;
}
.type-of-sake-page .rice-polishing-ratio .content:before{
    bottom: 55px;
}
.type-of-sake-page .rice-polishing-ratio .item-img img.last{
    max-width: 100%;
    width: auto;
    position: relative;
    left: -70px;
    top: -54px;
    width: 64%;
}
@media(max-width: 1024px){
    .type-of-sake-page .rice-polishing-ratio .content .inner{
        padding-right: 90px;
    }
}
@media(max-width: 768px){
    .type-of-sake-page .rice-polishing-ratio .content .inner,
    .type-of-sake-page .intro .content .inner
    {
        padding-right: 60px;
    }
    .type-of-sake-page .rice-polishing-ratio .item-img img.last{
        left: -50px;
    }
}
@media(max-width: 576px){
    .type-of-sake-page .intro
    {
        padding-bottom: 50px;
    }
    .type-of-sake-page .rice-polishing-ratio
    {
        padding: 50px 0;
    }
    .type-of-sake-page .rice-polishing-ratio .content .inner,
    .type-of-sake-page .intro .content .inner
    {
        padding-right: 0px;
    }
    .type-of-sake-page .rice-polishing-ratio .content .inner
    {
        padding-bottom: 25px;
    }
    .type-of-sake-page .rice-polishing-ratio .item-img img.last{
        position: unset;
        display: inline-block;
        width: 100%;
    }
}
/* list ======================================================= */
.type-of-sake-page .list
{
    padding: 95px 0 90px;
}
.type-of-sake-page .list .content
{
    width: 100%;
}
.type-of-sake-page .list .content .inner{
    padding-right: 60px;
}
.type-of-sake-page .row
{
    margin: 30px -15px 0 -15px;
}
.type-of-sake-page .row .col{
    width: 50%;
    padding-left: 15px;
    padding-right: 15px;
}
.type-of-sake-page .row .col ul{
    display: inline-block;
    width: 100%;
    margin: 0;
    padding: 0;
}
.type-of-sake-page .row .col ul li{
    margin-bottom: 30px;
}
.type-of-sake-page .row .col ul li:last-child{
    margin-bottom: 0;
}
.type-of-sake-page .row .col h3
{
    font-size: 1.375rem;
    position: relative;
    padding-left: 22px;
    line-height: 1.3;
}
.type-of-sake-page .row .col h3:before
{
    content: '';
    position: absolute;
    left: 0;
    top: 8px;
    width: 12px;
    height: 12px;
    background: #BBD2D8;
}
@media(max-width: 768px){
    .type-of-sake-page .list
    {
        padding: 75px 0 70px;
    }
}
@media(max-width: 576px){
    .type-of-sake-page .list
    {
        padding: 55px 0;
    }
    .type-of-sake-page .list .content .inner{
        padding-right: 0px;
        padding-bottom: 0;
    }
    .type-of-sake-page .row
    {
        margin: 25px 0 0 0;
    }
    .type-of-sake-page .row .col{
        width: 100%;
        padding-left: 0;
        padding-right: 0;
    }
    .type-of-sake-page .row .col h3
    {
        font-size: 1.25rem;
    }
    .type-of-sake-page .row .col ul li{
        margin-bottom: 25px;
    }
}
/* type-of-sake =============================================== */
.type-of-sake-page .type-of-sake
{
    margin-bottom: 30px;
}
.type-of-sake-page .type-of-sake .container
{
    padding-left: 80px;
    padding-right: 80px;
}
.type-of-sake-page .type-of-sake .inner
{
    display: block;
    background: #fff;
    border: 1px solid #EEEEEF;
    padding: 50px 30px 45px 30px;
}
.type-of-sake-page .type-of-sake h3{
    font-size: 2rem;
    text-align: center;
    line-height: 1.2;
    margin-bottom: 30px;
}
.type-of-sake-page .type-of-sake img{
    width: 100%;
}
@media(max-width: 576px){
    .type-of-sake-page .type-of-sake .container
    {
        padding-left: 20px;
        padding-right: 20px;
    }
    .type-of-sake-page .type-of-sake .inner
    {
        padding: 30px 20px 25px 20px;
    }
    .type-of-sake-page .type-of-sake .img{
        width: 850px;
    }
}
/* link =============================================== */
.type-of-sake-page .link
{
    text-align: center;
    padding: 60px 0 120px;
}
.type-of-sake-page .link .desc
{
    font-size: 1.18rem;
    margin-bottom: 30px;
}
@media(max-width: 576px){
    .type-of-sake-page .link
    {
        padding: 20px 0 90px;
    }
}
/*
==========================================================================
========================== End Types of sake page ========================
==========================================================================
*/
/*
==========================================================================
============================= how to drink page ==========================
==========================================================================
*/
.how-to-drink-page .nav-page li{
    padding-left: 110px;
    padding-right: 110px;
}
.how-to-drink-page .how-to-drink .col:first-child
{
    width: 60%;
    padding-right: 150px;
}
.how-to-drink-page .how-to-drink .col:last-child
{
    width: 40%;
}
.how-to-drink-page .how-to-drink ul{
    display: inline-block;
    width: 100%;
    margin-top: 80px;
    padding-right: 80px;
}
.how-to-drink-page .how-to-drink ul li{
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    margin-bottom: 45px;
}
.how-to-drink-page .how-to-drink ul li:last-child
{
    margin-bottom: 0;
}
.how-to-drink-page .how-to-drink ul li .num{
    font-size: 3rem;
    padding-right: 48px;
    padding-top: 3px;
}
.how-to-drink-page .how-to-drink ul li h3{
    font-size: 1.375rem;
    line-height: 1.2;
    margin-bottom: 18px;
}

.how-to-drink-page .temperature-ranges
{
    margin: 50px 0 110px;
}
.how-to-drink-page .temperature-ranges .container
{
    padding-left: 80px;
    padding-right: 80px;
}
.how-to-drink-page .temperature-ranges .inner
{
    display: block;
    background: #fff;
    border: 1px solid #EEEEEF;
    padding: 60px 65px;
}
.how-to-drink-page .temperature-ranges h3{
    font-size: 2.12rem;
    text-align: center;
    line-height: 1.3;
    margin-bottom: 30px;
}
.how-to-drink-page .temperature-ranges img{
    width: 100%;
}
@media(max-width: 1100px){
    .how-to-drink-page .how-to-drink .col:first-child
    {
        padding-right: 80px;
    }
}
@media(max-width: 1024px){
    .how-to-drink-page .how-to-drink .col:first-child
    {
        padding-right: 30px;
    }
}
@media(max-width: 768px){
    .how-to-drink-page .how-to-drink ul
    {
        padding-right: 0px;
    }
    .how-to-drink-page .nav-page li{
        padding-left: 65px;
        padding-right: 65px;
    }
    .how-to-drink-page .how-to-drink .col:first-child
    {
        padding-right: 0px;
        width: 100%;
    }
    .how-to-drink-page .how-to-drink .col:last-child
    {
        width: 100%;
        padding-right: 38px;
        margin-top: 30px;
    }
    .how-to-drink-page .temperature-ranges .inner
    {
        padding: 40px 45px;
    }
    .how-to-drink-page .temperature-ranges
    {
        margin: 40px 0 80px;
    }
}
@media(max-width: 576px){
    .how-to-drink-page .nav-page .container{
        padding-left: 35px;
        padding-right: 35px;
    }
    .how-to-drink-page .nav-page ul{
        margin-left: -35px;
        margin-right: -35px;
    }
    .how-to-drink-page .nav-page li{
        padding-left: 35px;
        padding-right: 35px;
        width: auto;
    }
    .how-to-drink-page .how-to-drink .col:last-child
    {
        padding-right: 0px;
        margin-top: 25px;
    }
    .how-to-drink-page .how-to-drink ul
    {
        margin-top: 50px;
    }
    .how-to-drink-page .how-to-drink ul li
    {
        margin-bottom: 35px;
    }
    .how-to-drink-page .how-to-drink ul li .num
    {
        padding: 3px 24px 0 5px;
    }
    .how-to-drink-page .how-to-drink ul li h3
    {
        margin-bottom: 15px;
    }
    .how-to-drink-page .temperature-ranges
    {
        margin: 20px 0 50px;
    }
    .how-to-drink-page .temperature-ranges .container
    {
        padding-left: 20px;
        padding-right: 20px;
    }
    .how-to-drink-page .temperature-ranges .inner
    {
        padding: 30px 20px 25px 20px;
    }
    .how-to-drink-page .temperature-ranges h3{
        font-size: 1.8rem;
    }
    .how-to-drink-page .temperature-ranges .img{
        width: 850px;
    }
}
@media(max-width: 480px){
    .how-to-drink-page .nav-page .container{
        padding-left: 20px;
        padding-right: 20px;
    }
    .how-to-drink-page .nav-page ul{
        margin-left: -15px;
        margin-right: -15px;
    }
    .how-to-drink-page .nav-page li{
        padding-left: 15px;
        padding-right: 15px;
    }
}
@media(max-width: 375px){
    .how-to-drink-page .temperature-ranges h3{
        font-size: 1.7rem;
    }
}
@media(max-width: 320px){
    .how-to-drink-page .temperature-ranges h3{
        font-size: 1.5rem;
    }
}
/* Sake Vessels ========================================= */
.how-to-drink-page .sake-vessels {
    padding: 85px 0 0px;
}
.how-to-drink-page .sake-vessels .item-img img{
    margin-bottom: 45px;
}
.how-to-drink-page .sake-vessels .item-img img:last-child{
    margin-bottom: 0px;
}
.how-to-drink-page .sake-vessels .content .inner
{
    padding-right: 65px;
}
.how-to-drink-page .sake-vessels ul,
.how-to-drink-page .sake-vessels ul li{
    display: inline-block;
    width: 100%;
}
.how-to-drink-page .sake-vessels ul{
    margin-top: 35px;
}
.how-to-drink-page .sake-vessels ul li
{
    margin-bottom: 35px;
}
.how-to-drink-page .sake-vessels ul li:last-child{
    margin-bottom: 0;
}
.how-to-drink-page .sake-vessels ul li .group{
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    position: relative;
}
.how-to-drink-page .sake-vessels ul li .group .txt{
    flex: 1;
    padding-right: 10px;
    position: relative;
}
.how-to-drink-page .sake-vessels ul li .group .img{
    width: 118px;
    min-width: 118px;
    padding-top: 7px;
}
.how-to-drink-page .sake-vessels ul li .group .img img{
    width: 100%;
}
.how-to-drink-page .sake-vessels ul li h3{
    font-size: 1.375rem;
    position: relative;
    line-height: 1.2;
    padding-left: 22px;
    margin-bottom: 10px;
}
.how-to-drink-page .sake-vessels ul li h3::before {
  content: '';
  position: absolute;
  left: 0;
  top: 8px;
  width: 12px;
  height: 12px;
  background: #BBD2D8;
}
.how-to-drink-page .inline-shop
{
    padding: 60px 100px 110px 100px;
}
.how-to-drink-page .inline-shop a{
    display: inline-block;
}
.how-to-drink-page .inline-shop img{
    width: 100%;
}
@media(max-width: 768px){
    .how-to-drink-page .inline-shop {
        padding: 40px 60px 80px 60px;
    }
    .how-to-drink-page .sake-vessels .item-img
    {
        padding-top: 30px;
    }
}
@media(max-width: 576px){
    .how-to-drink-page .sake-vessels {
        padding-top: 50px;
    }
    .how-to-drink-page .sake-vessels .content .inner
    {
        padding-right: 0;
    }
    .how-to-drink-page .sake-vessels ul{
        margin-top: 30px;
    }
    .how-to-drink-page .sake-vessels ul li
    {
        margin-bottom: 30px;
    }

    .how-to-drink-page .sake-vessels .item-img img
    {
        margin-bottom: 20px;
    }
    .how-to-drink-page .inline-shop {
        padding: 50px 0px 70px 0px;
    }
}
@media(max-width: 480px){
    .how-to-drink-page .sake-vessels .item-img
    {
        padding-top: 10px;
    }
    .how-to-drink-page .sake-vessels ul li .group
    {
        display: inline-block;
        width: 100%;
        padding-top: 140px;
    }
    .how-to-drink-page .sake-vessels ul li .group .txt{
        padding-right: 0px;
        margin-top: 10px;
    }
    .how-to-drink-page .sake-vessels ul li .group .img
    {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        text-align: center;
        width: 100%;
        padding-top: 10px;
    }
    .how-to-drink-page .sake-vessels ul li .group .img img{
        width: 118px;
    }
}
/*
==========================================================================
=========================== End how to drink page ========================
==========================================================================
*/
/*
==========================================================================
=============================== company page =============================
==========================================================================
*/
.company-page .item.content
{
    width: calc(60% - 100px);
}
.company-page .item-img
{
    width: calc(40% + 100px);
    padding-right: 100px;
}
.company-page .item.content .inner{
    padding-right: 100px;
}
.company-page .item-img .last{
    position: relative;
    top: -70px;
    right: -100px;
    width: 62%;
    float: right;
}
@media(max-width: 1200px){
    .company-page .item.content
    {
        width: calc(60% - 80px);
    }
    .company-page .item-img
    {
        width: calc(40% + 80px);
        padding-right: 80px;
    }
    .company-page .item.content .inner{
        padding-right: 60px;
    }
    .company-page .item-img .last{
        right: -80px;
    }
}
@media(max-width: 1024px){
    .company-page .item.content
    {
        width: calc(62% - 60px);
    }
    .company-page .item-img
    {
        width: calc(38% + 60px);
        padding-right: 40px;
    }
    .company-page .item.content .inner{
        padding-right: 40px;
    }
    .company-page .item-img .last{
        right: -40px;
    }
}
@media(max-width: 768px){
    .company-page .item.content,
    .company-page .item-img
    {
        width: 100%;
    }
    .company-page .item-img
    {
        padding-right: 58px;
    }
    .company-page .item.content .inner{
        padding-right: 60px;
    }
    .company-page .item-img .last{
        right: 0px;
        top: 0;
        width: 100%;
        float: none;
        margin-top: 10px;
    }
}
@media(max-width: 576px){
    .company-page .item.content .inner,
    .company-page .item-img{
        padding-right: 0px;
    }
}
/* company information ========================================== */
.company-page .company-info
{
    padding: 80px 0 50px;
}
.company-page .company-info h2.title{
    text-align: center;
    margin-bottom: 60px;
}
.company-page .company-info h2.title.history
{
    margin-top: 120px;
}
@media(max-width: 768px){
    .company-page .company-info
    {
        padding: 70px 0 30px;
    }
    .company-page .company-info h2.title{
        margin-bottom: 50px;
    }
    .company-page .company-info h2.title.history
    {
        margin-top: 80px;
    }
}
@media(max-width: 576px){
    .company-page .company-info
    {
        padding: 50px 0 20px;
    }
    .company-page .company-info h2.title{
        margin-bottom: 25px;
        text-align: left;
    }
    .company-page .company-info h2.title span{
        display: inline-block;
        width: 100%;
        text-align: center;
    }
    .company-page .company-info h2.title.history
    {
        margin-top: 55px;
    }
}
/*
==========================================================================
=========================== End company page =============================
==========================================================================
*/
/*
==========================================================================
============================== contact page ==============================
==========================================================================
*/
.contact-page
{
    padding-bottom: 100px;
}
.contact-page h2.title,
.contact-page .required-note
{
    margin-bottom: 30px;
}
.contact-page textarea
{
    height: 165px;
}
.contact-page .btn-group{
    padding-bottom: 20px;
}
@media(max-width: 768px){
    .contact-page
    {
        padding-bottom: 80px;
    }
    .contact-page h2.title,
    .contact-page .required-note
    {
        margin-bottom: 20px;
    }
}
@media(max-width: 576px){
    .contact-page
    {
        padding-bottom: 60px;
    }
    .contact-page h2.title,
    .contact-page .required-note
    {
        margin-bottom: 20px;
    }
    .contact-page h2.title span
    {
        display: inline-block;
        width: 100%;
    }
}
/*
==========================================================================
============================ End contact page ============================
==========================================================================
*/
/*
==========================================================================
=========================== Sake breweries page ==========================
==========================================================================
*/
.sake-breweries-page .breweries .items
{
    margin-left: -20px;
    margin-right: -20px;
    margin-top: 35px;
}
.sake-breweries-page .breweries .item
{
    width: 33.33%;
    padding-left: 20px;
    padding-right: 20px;
    margin-bottom: 40px;
}
.sake-breweries-page .breweries .item a
{
    display: block;
    width: 100%;
    height: 100%;
    background: #fff;
    box-shadow: 0px 1px 10px 1px rgba(0, 0, 0, 0.15);
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    color: inherit;
}
.sake-breweries-page .breweries .item .img{
    position: relative;
    width: 100%;
    /*padding-top: 56.25%;*/
    padding-top: 100%;
    overflow: hidden;
}
.sake-breweries-page .breweries .item img
{
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center center;
    object-position: center center;
    position: absolute;
    top: 0;
    left: 0;
    width: auto;
    min-width: 100%;
    height: auto;
    min-height: 100%;
    vertical-align: middle;
}
.sake-breweries-page .breweries .item .txt
{
    font-size: 1.375rem;
    line-height: 1.4;
    display: inline-block;
    width: 100%;
    text-align: center;
    padding: 22px 10px;
}
.sake-breweries-page .pagination{
    margin: 20px 0 15px 0;
}
@media(max-width: 768px){
    .sake-breweries-page .breweries .items
    {
        margin-left: -10px;
        margin-right: -10px;
        margin-top: 30px;
    }
    .sake-breweries-page .breweries .item
    {
        padding-left: 10px;
        padding-right: 10px;
        margin-bottom: 20px;
    }
    .sake-breweries-page .breweries .item .txt
    {
        padding: 17px 10px;
    }
}
@media(max-width: 767px){
    .sake-breweries-page .breweries .item
    {
        width: 50%;
    }
}
@media(max-width: 480px){
    .sake-breweries-page .breweries .items
    {
        margin-left: 0;
        margin-right: 0;
        margin-top: 15px;
    }
    .sake-breweries-page .breweries .item
    {
        width: 100%;
        padding-left: 0;
        padding-right: 0;
    }
}
/*
==========================================================================
========================= End Sake breweries page ========================
==========================================================================
*/
/*
==============================================================
========================= 404 page ===========================
==============================================================
*/
.error-page
{
    margin: 30px auto 80px auto;
    min-height: calc(100vh - 138px);
}
.error-page .container
{
    text-align: center;
}
.error-page h1
{
    font-size: 3.5rem;
    font-weight: bold;
    line-height: 1.2;
    padding-bottom: 20px;
    font-family: Helvetica, sans-serif;
    margin-top: 40px;
    display: inline-block;
    width: 100%;
}
.error-page h2
{
    text-align: center;
    font-weight: bold;
    display: block;
    font-size: 1.3em;
    margin-block-start: 0.83em;
    margin-block-end: 0.83em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}
.error-page h3 {
    font-size: 1.3rem;
    margin-top: 50px;
}
.error-page .explain {
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    line-height: 1.5;
    margin: 30px auto;
    padding: 17px;
    max-width: 640px;
}
.error-page #white_box {
    margin: 15px auto 0;
    background-color: white;
    max-width: 640px;
    text-align: left;
    background: #bfbfbf;
    padding: 20px;
}
.error-page #white_box ul {
    list-style-type: disc;
    padding-left: 10px;
}
header.error-header
{
    height: 100px;
}
.error-header .main-nav
{
    background: #222222;
}
@media(max-width: 768px){
    .error-page
    {
        margin-top: 80px;
    }
    header.error-header
    {
        height: auto;
    }
    header.error-header .header-top
    {
        background: #222222;
    }
    .error-page h1
    {
        font-size: 3rem;
    }
    .error-page h2
    {
        font-size: 1.2rem;
    }
    .error-page h3
    {
        font-size: 1rem;
    }
    .error-page #white_box ul {
        font-size: 0.93rem;
    }
}
/*
==============================================================
======================= End 404 page =========================
==============================================================
*/
/*
==============================================================
====================== ANIMATION LOADER ======================
==============================================================
*/
.fl__loading_backdrop
{
	position: fixed;
	z-index: 99999999;
	/* top: 0;
	bottom: 0;
	left: 0;
	right: 0; */
}
.fl__loadmore
{
	display: inline-block;
	width: 100%;
	text-align: center;
	padding: 10px 0px 70px;
}
.fl__loadmore .fl__spinner
{
	position: unset;
}
.fl__spinner {
	color: red;
	display: inline-block;
	position: fixed;
	width: 50px;
	height: 50px;
	top: 50%;
	left: 50%;
	margin-top: -25px;
	margin-left: -25px;
}
.fl__spinner span {
	transform-origin: 30px 30px;
	animation: fl__spinner 1.2s linear infinite;
    display: inline-block;
}
.fl__spinner span:after {
	content: " ";
    display: block;
    position: absolute;
    top: 3px;
    left: 27px;
    width: 5px;
    height: 16px;
    border-radius: 20%;
    background: #111
}
.fl__spinner span:nth-child(1) {
	transform: rotate(0deg);
	animation-delay: -1.1s;
}
.fl__spinner span:nth-child(2) {
	transform: rotate(30deg);
	animation-delay: -1s;
}
.fl__spinner span:nth-child(3) {
	transform: rotate(60deg);
	animation-delay: -0.9s;
}
.fl__spinner span:nth-child(4) {
	transform: rotate(90deg);
	animation-delay: -0.8s;
}
.fl__spinner span:nth-child(5) {
	transform: rotate(120deg);
	animation-delay: -0.7s;
}
.fl__spinner span:nth-child(6) {
	transform: rotate(150deg);
	animation-delay: -0.6s;
}
.fl__spinner span:nth-child(7) {
	transform: rotate(180deg);
	animation-delay: -0.5s;
}
.fl__spinner span:nth-child(8) {
	transform: rotate(210deg);
	animation-delay: -0.4s;
}
.fl__spinner span:nth-child(9) {
	transform: rotate(240deg);
	animation-delay: -0.3s;
}
.fl__spinner span:nth-child(10) {
	transform: rotate(270deg);
	animation-delay: -0.2s;
}
.fl__spinner span:nth-child(11) {
	transform: rotate(300deg);
	animation-delay: -0.1s;
}
.fl__spinner span:nth-child(12) {
	transform: rotate(330deg);
	animation-delay: 0s;
}
@keyframes fl__spinner {
	0% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}
.fl__spinner.fl__spinner_small
{
	width: 30px;
    height: 30px;
    margin-top: -15px;
    margin-left: -15px;
}
.fl__spinner.fl__spinner_small span
{
	transform-origin: 20px 20px;
}
.fl__spinner.fl__spinner_small span:after
{
    top: 3px;
    left: 18px;
    width: 4px;
    height: 12px;
}
/*
==============================================================
=================== End ANIMATION LOADER =====================
==============================================================
*/
/*
==============================================================
======================= Error message ========================
==============================================================
*/
.control-error
{
    display: block;
    width: 100%;
    color: #A2272D;
    margin-bottom: 3px;
}
.control-error.custom{
    display: none;
}
[custom-error-messages]{
    display: none;
}
.error-messages,
.not-found
{
    display: inline-block;
    width: 100%;
    padding: 15px 10px 15px 50px;
    margin-bottom: 20px;
    border: 1px solid;
    position: relative;
    background-color: rgb(255, 251, 251);
    border: 1px solid rgb(255, 149, 156);
    color: #A2272D;
}
.error-messages:before,
.not-found:before
{
    content: '';
    background: url('../img/ic-error.png') no-repeat;
    color: #A2272D;
    position: absolute;
    left: 15px;
    top: 50%;
    margin-top: -12px;
    z-index: 100;
    width: 24px;
    height: 24px;
    background-size: 100%;
}
.error-messages.success:before
{
    content: "";
    background: url('../img/ic-success.png') no-repeat;
    background-size: 100%;
}
.error-messages.validation
{
    background: #FFCCBA;
    color: #D63301;
    border-color:#D63301;
}
.error-messages.info
{
    background: #BDE5F8;
    color: #00529B;
    border-color:#00529B;
}
.error-messages.success
{
    background: #DFF2BF;
    color: #4F8A10;
    border-color:#4F8A10;
}
.error-messages.warning
{
    background: #FEEFB3;
    color: #9F6000;
    border-color:#9F6000;
}
.error-messages.error
{
    background: #FFBABA;
    color: #D8000C;
    border-color:#D8000C;
}
.error-messages.validation
{
    background: #FFCCBA;
    color: #D63301;
    border-color:#D63301;
}
.error-messages p{
    margin-bottom: 3px;
}
input:disabled {
    background: #eee;
}
.user-page .wrap-error
{
    max-width: 420px;
    text-align: center;
    margin: 0 auto;
}
.user-page .wrap-error .error-messages
{
    text-align: left;
    margin-top: 30px;
}
/*
==============================================================
===================== End Error message ======================
==============================================================
*/
/*
==============================================================
===================== Custom jquery dialog ===================
==============================================================
*/
.jconfirm .container
{
    max-width: 520px;
}
.jconfirm .jconfirm-buttons
{
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: flex-end;
    -ms-flex-pack: flex-end;
    -webkit-justify-content: flex-end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
.jconfirm .jconfirm-buttons .btn
{
    width: 110px;
    margin-left: 10px !important;
    color: #fff !important;
    background: #A2272D !important;
}
.jconfirm .jconfirm-buttons .btn:before{
    background: none;
}
.jconfirm .jconfirm-buttons .btn:after {
    border: none;
}
.jconfirm .jconfirm-buttons .btn.btn-ok
{
    background: #000 !important;
    color: #fff !important;
}
/*
==============================================================
=================== End Custom jquery dialog =================
==============================================================
*/

/*
20230322 add orienst.inc
*/
.company-page .detailSec {
	padding: 0 0 75pt
}
.company-page .detailSec .headLine02 .info:before {
	width: 82px;
	left: -92px
}
.company-page .detailSec .headLine02 .info:after {
	width: 82px;
	right: -92px
}
.company-page .detailSec .innerBox {
	margin: 0 0 50px;
	padding: 3pc 58px;
	display: flex;
	position: relative;
	justify-content: space-between;
	background: #fff
}
.company-page .detailSec .innerBox:last-child {
	margin-bottom: 0
}
.company-page .detailSec .innerBox:before {
	position: absolute;
	right: -99pt;
	top: 49px;
	width: 5in;
	height: 3in;
	background: url(../img/company/photo05.png)no-repeat left top;
	background-size: 33pc 3in;
	content: ""
}
.company-page .detailSec .innerBox.bg02:before {
	position: absolute;
	right: auto;
	left: -110px;
	top: 42px;
	width: 350px;
	height: 291px;
	background: url(../img/company/photo06.png)no-repeat left top;
	background-size: 374px 291px;
	content: ""
}
.company-page .detailSec .innerBox.bg03:before {
	position: absolute;
	right: -133px;
	top: 2pc;
	width: 390px;
	height: 291px;
	background: url(../img/company/photo07.png)no-repeat left top;
	background-size: 411px 291px;
	content: ""
}
.company-page .detailSec .innerBox.bg04:before {
	position: absolute;
	right: auto;
	left: -110px;
	top: 52px;
	width: 380px;
	height: 316px;
	background: url(../img/company/photo08.png)no-repeat left top;
	background-size: 440px 316px;
	content: ""
}
.company-page .detailSec .innerBox .photoBox {
	width: 360px
}
.company-page .detailSec .innerBox .textBox {
	width: 639px;
	box-sizing: border-box
}
.company-page .detailSec .innerBox .textBox .sp {
	display: none
}
.company-page .detailSec .innerBox .textBox .title {
	margin-bottom: 20px;
	font-size: 2.1rem;
	color: #000
}
.company-page .detailSec .innerBox .textBox .title .small {
	display: block;
	font-size: 1.3rem;
	margin-top: 0;
	letter-spacing: .05em;
	line-height: 3
}
.company-page .detailSec .innerBox .textBox .txtP {
	margin-bottom: 42px;
	font-size: 1rem;
	line-height: 1.65
}
.company-page .detailSec .innerBox .textBox .txtP:last-child {
	margin-bottom: 0
}
.company-page .detailSec .innerBox01 {
	flex-direction: row-reverse
}
.company-page .detailSec .innerBox01 .textBox {
	padding-left: 15pc;
	width: 680px
}
.company-page .detailSec h2.title {
	text-align: center;
	margin-bottom: 60px;
	line-height: 1
}
.company-page .content-group .item-img {
	width: 40%;
	padding-top: 40px
}
@media(max-width:768px) {
	.company-page .detailSec {
		padding: 0 0 50px
	}
	.company-page .detailSec h2.title {
		text-align: center;
		margin-bottom: 30px;
		line-height: 1.5
	}
	.company-page .detailSec .headLine02 .info:before {
		width: 36px;
		left: -36px
	}
	.company-page .detailSec .headLine02 .info:after {
		width: 36px;
		right: -36px
	}
	.company-page .detailSec .innerBox {
		margin: 0 0 30px;
		padding: 20px;
		display: block
	}
	.company-page .detailSec .innerBox:before {
		display: none!important
	}
	.company-page .detailSec .innerBox .photoBox {
		width: auto
	}
	.company-page .detailSec .innerBox .photoBox img {
		width: 97%;
		margin-bottom: 15px
	}
	.company-page .detailSec .innerBox .textBox {
		width: auto;
		box-sizing: border-box
	}
	.company-page .detailSec .innerBox01 .textBox {
		padding-left: 0;
		width: auto
	}
	.company-page .detailSec .innerBox .textBox .title {
		font-size: 2rem;
		margin-bottom: 15px;
		line-height: 1.5
	}
	.company-page .detailSec .innerBox .textBox .title .small {
		line-height: inherit
	}
	.company-page .detailSec .innerBox .textBox .txtP {
		margin-bottom: 22px
	}
	.company-page .detailSec .innerBox .textBox .txtP:last-child {
		margin-bottom: 0
	}
	.company-page .detailSec .innerBox .spPho {
		text-align: center;
		padding: 0 0 30px
	}
	.company-page .detailSec .innerBox .textBox .sp {
		display: inline
	}
	.company-page .content-group .item-img {
		width: 100%;
		padding-top: 20px
	}
}
.company-page .detailSec .innerBox .photoBox {
	width: 20pc
}
@media(max-width:1480px) {
	.company-page .detailSec .innerBox:before {
		right: -10pt;
		top: 75pt;
		width: 300px;
		height: 200px;
		background-size: 110%
	}
	.company-page .detailSec .innerBox.bg02:before {
		left: -20px;
		top: 90px;
		width: 296px;
		height: 230px;
		background-size: 100%
	}
	.company-page .detailSec .innerBox.bg03:before {
		right: -20px;
		top: 91px;
		width: 280px;
		height: 294px;
		background-size: 100%
	}
	.company-page .detailSec .innerBox.bg04:before {
		left: -15px;
		top: 90px;
		width: 280px;
		height: 231px;
		background-size: 100%
	}
	.company-page .detailSec .innerBox .photoBox {
		padding: 10px
	}
}
@media(max-width:1024px) {
	.company-page .detailSec .innerBox {
		padding: 3pc 20px
	}
	.company-page .detailSec .innerBox .textBox {
		max-width: 35pc
	}
	.company-page .detailSec .innerBox:before {
		width: 260px
	}
	.company-page .detailSec .innerBox.bg02:before {
		width: 250px
	}
	.company-page .detailSec .innerBox.bg03:before {
		top: 122px;
		width: 230px
	}
	.company-page .detailSec .innerBox.bg04:before {
		left: -15px;
		width: 15pc;
	}
	.company-page .detailSec .innerBox .textBox .title {
		line-height: 1.2
	}
}
/* *************20230324追加*/
/*  howtodrink page  */
.how-to-drink-page .how-to-drink ul li .num {
    padding-right: 71px;
}
.how-to-drink-page .how-to-drink ul li .ten{
    white-space: nowrap;
    padding-right: 42px;
}
@media(max-width:576px){
    .how-to-drink-page .how-to-drink ul li .num {
        padding-right: 53px;
        font-size: 2.7rem;
    }
    .how-to-drink-page .how-to-drink ul li .ten{
        white-space: nowrap;
        padding-right: 25px;
    }
}
/*  aboutsake page  */
.about-sake-page .block {
    padding: 80px 0 40px 0;
}
.about-sake-page .make-sake
{
    margin-top: 0px;
    margin-bottom: 80px;
}
.about-sake-page .make-sake .desc .large {
    margin-top: 30px;
    margin-bottom: 100px;
}
.about-sake-page .block3 .item.item-img {
    padding-bottom: 300px;
}
.about-sake-page .make-sake .desc.makingsake {
    text-align: left;
}
.makingsake .item_box{
    margin-bottom: 40px;
}
.makingsake .item_box .num {
    font-size: 2rem;
    display: inline-block;
    padding: 0 0 30px 0;
    text-align: center;
}
.makingsake .item_box .num .small{
    font-size: 1.7rem;
}
.makingsake .item_box .group {
    display: flex;
    position: relative;
}
.makingsake .item_box .txt {
    flex: 1;
    padding-right: 40px;
}
.makingsake .item_box p.img {
    width: 100px;
    min-width: 100px;
}

.makingsake .item_box p.img span {
    width: 98px;
    height: 98px;
    background: #fff;
    border-radius: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
.about-sake-page .make-sake {
    margin-top: 0px;
    padding: 0 0 150px 0;
    margin-bottom: 0;
}
.about-sake-page .make-sake h2.pt60{
    padding-top: 60px;
}
.about-sake-page .make-sake .desc {
    margin-bottom: 0px;
}
@media(max-width:576px){
   .about-sake-page .block3 .item.item-img {
    padding-bottom: 0px;
}
.about-sake-page .make-sake .desc .large {
    width: 820px;
}
.makingsake .item_box .group {
    flex-direction: column;
}
.makingsake .item_box .txt {
    padding-right: 0px;
    margin: 0 0 10px 0;
}
.makingsake .item_box p.img {
    margin: 0 auto;
}
.makingsake .item_box .num {
    font-size: 1.7rem;
    text-align: left;
    padding: 0 0 15px 0;
}
.about-sake-page .make-sake {
    padding: 0 0 50px 0;
}
}
/*  type of sake page  */
.typeofsake_text01{
    margin-bottom: 30px;
}
em{
    font-style: italic;
}
strong{
    font-weight: bold;
}
.about-sake-page{
    font-weight: normal;
}
.type-of-sake-page{
    font-weight: normal;
}
/* 20230330追加 */
.type-of-sake-page .read_text{
    margin: 0 0 30px 0;
}
.how-to-drink-page .how-to-drink ul li .num {
    padding-right: 97px;
    white-space: nowrap;
}
.how-to-drink-page .how-to-drink ul li .ten{
    padding-right: 70px;
}
.how-to-drink-page .vessels_box01{
    margin-bottom: 30px;
}
@media(max-width:576px){
    .how-to-drink-page .how-to-drink ul li .num {
        padding-right: 50px;
    }
    .how-to-drink-page .how-to-drink ul li .ten{
        padding-right: 25px;
    }
}
.form-row label.title {
    padding: 0 0 0 20px;
    width: 230px;
    min-width: 257px;
}
.group2:before{
    display: none;
}
.company-page .company-info a{
    color: #000;
    text-decoration: underline;
}
.company-page .company-info a:hover{
    text-decoration: none;
}