@charset "UTF-8";

@media (max-width: 1200px)  {

.footer_top iframe{
    width: calc(94% - 300px);

    position: absolute;
    top: 0px;
    right: 0px;
}

.home_about > figure{
    left: auto;
    right: 50%;
}

.company_access > div{
    margin: 0;
}

.company_access > div > h3{
    padding-left: calc((100vw - 1000px)/2)
}


}

@media (max-width: 1100px)  {

.home_news_column{
    right: -80px;
}

}

@media (max-width: 1000px)  {

/* cmn ///////////////////////////////////// */

/* modal_menu */

#header_modalmenu_close_bg,
#header_modalmenu_area{
    display: block;
}

/* header */

.header_infobar,
.header_infobar.header_scrollanime{
    height: 60px;
    padding: 0;
}

.header_phone a{
    display: block;
    width: 60px;
    height: 60px;

    background-position: center;
}

.header_topnavi{
    display: none;
}

.header_logo,
.header_infobar.header_scrollanime .header_logo{
    height: 40px;
    top: 10px;
}

/* cmn_maintitle */

.cmn_mainimg{
    margin-top: 60px;
    height: 200px;
}

.cmn_maintitle{
    padding-top: 0px;
}

/* footer */

.footer_gotop {
    right: 10px;
    bottom: 10px;
}

.footer_attention{
    margin-top: 20px;
}

/* cmn_itemlist */

.cmn_itemlist{
    grid-gap: 35px 3%;
}

/* cmn_searchbox */

.search_cat{
    grid-template-columns: repeat(4, 1fr);
}


/* home ///////////////////////////////////// */

/* home_mainimg */

.home_mainimg{
    height: 800px;
}

.home_mainimg::before{
    height: 800px;
    background-size: 560px auto, cover;
    background-position: left 50px top 120px ,center;
}

/* home_news */

.home_news{
    min-height: auto;
}

.home_news .cmn_content{
    width: 100%;
}

.home_news .cmn_content .cmn_btn a{
    margin: 20px auto 0;
}

.home_news_column{
    width: auto;
    height: 320px;
    margin-top: 40px;
    padding: 0 10px;

    border-radius: 0;

    position: relative;
    top: auto;
    right: auto;
}

/* home_about */

.home_about{
    min-height: auto;
}

.home_about > figure{
    width: calc(97% -  500px);

    top: auto;
    bottom: 10px;
    left: 0px;
    right: auto;
}

/* home_others */

.home_others .cmn_content{
    flex-wrap: wrap;
    justify-content: center;
}

.home_others .cmn_content > div:nth-of-type(2){
    margin-top: 30px;
}

/* message ///////////////////////////////////// */

.message_mainimg{
    margin-top: 60px;
}

.message_mainimg > figure{
    width: 550px;

    bottom: 20px;
    right: 20px;
}

.message_point ul li:nth-child(2n) > div > h3::before{
    position: absolute;
    top: -50px;
    left: -10px;
}

.message_delivery h2 span{
    padding-left: 70px;
    padding-top: 30px;

    background-image: url(../img/cmn_tit_1st_deco.svg);
    background-repeat: no-repeat;
    background-position: left bottom;
}

.message_delivery .cmn_content{
    justify-content: center;
}

.message_delivery .cmn_content > div:nth-of-type(2){
    margin-top: 30px;
}

/* company ///////////////////////////////////// */

.company_info > div > figure{
    width: 47%;
}

.company_access{
    padding-top: 140px;
    margin-top: -60px;
}

.company_access > div{
    width: 100%;
    padding-left: 3%;
    padding-right: 3%;
}

.company_access > div > h3{
    width: auto;
    padding-top: 30px;
    padding-left: 0;
    padding-right: 5%;
    flex-shrink: 0;
}




}




















@media (max-width: 800px) {

/* cmn ///////////////////////////////////// */

/* cmn_cms_editor */
.cmn_cms_editor h3 {
    font-size: 1.6rem;
}
.cmn_cms_editor h4 {
    font-size: 1.6rem;
}
.cmn_cms_editor h5 {
    font-size: 1.5rem;
}
.cmn_cms_editor h6 {
    font-size: 1.4rem;
}

/* footer */

.footer_top iframe{
    width: 100%;
    height: 300px;

    position: relative;
}

.footer_top_left{
    height: auto;
    padding-top: 40px;
    padding-bottom: 40px;
}

.footer_top_left_inner{
    margin: 0 auto;
}

.footer_bottom ul{
    justify-content: center;
}

.footer_attention{
    margin: 20px auto 0;
}

.footer_attention > figure > img{
    height: 60px;
}

.footer_bottom small{
    margin-top: 20px;
}


/* cmn_tit */

.cmn_tit_1st h2{
    padding-top: 70px;
    background-size: auto 56px;
}

/* cmn_dl */

.cmn_dl > div{
    display: block;
}

.cmn_dl > div dt{
    width: 100%;
    padding: 15px 20px 0 20px;
}

.cmn_dl > div dd{
    padding: 15px 20px;
}

/* cmn_itemlist */

.cmn_itemlist{
    grid-template-columns: repeat(3, 1fr);
}

/* cmn_searchbox */

.search_cat{
    grid-template-columns: repeat(3, 1fr);
}

.search_form > dl > div{
    display: block;
}

.search_form > dl > div > dt{
    width: 100%;
    padding: 0;
}

.search_form > dl > div > dd{
    margin-top: 10px;
    padding: 0;
}



/* home ///////////////////////////////////// */

/* home_mainimg */

.home_mainimg::before{
    background-size: 80% auto, cover;
    background-position: center center ,center;
}

/* home_about */

.home_about .cmn_content{
    width: 100%;
}

.marker_animation::before{
    bottom: 46px;
}

.home_about .cmn_content .cmn_btn{
    justify-content: space-around;
}

.home_about > figure{
    width: 100%;
    margin-top: 30px;

    position: relative;
    bottom: auto;
    left: auto;
}

/* news ///////////////////////////////////// */

/* column ///////////////////////////////////// */

.column_list ul{
    grid-gap: 20px 3%;
}

/* message ///////////////////////////////////// */

.message_mainimg > figure{
    width: 400px;
}

.message_point h2,
.message_delivery h2 span{
    padding-top: 70px;
    padding-left: 0px;
    background-size: auto 56px;
    background-position: center top;
}

.message_point h2 span.deco::before{
    right: 147px;
}

.message_point h2 span.deco::after{
    right: 117px;
}

/* items ///////////////////////////////////// */

/* item_detail */

.item_about{
    grid-template-columns: 1fr;
}

.item_about_mainimg{
    /* transition: all .3s; */
}

.item_about_feature .cmn_dl > div dt{
    width: 100%;
    padding: 15px 10px 0;
}

.items_tips h2 span{
    padding-top: 70px;
    padding-left: 0px;
    background-size: auto 56px;
    background-position: center top;
}

.items_tips_list{
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 30px 3%;
}

.items_tips_tit{
    height: auto;
}

/* company ///////////////////////////////////// */

.company_info > div > figure{
    width: 100%;
    height: auto;

    position: relative;
    bottom: auto;
    right: auto;
}

.company_info .cmn_dl{
    width: 100%;
}

.company_info .cmn_dl > div dt{
    width: 100%;
    padding: 15px 20px 0 20px;
}

.company_info .cmn_dl > div dd{
    padding: 15px 20px;
}

.company_access{
    padding-top: 124px;
}

.company_access > div{
    display: block;
}

.company_access > div > h3{
    padding: 0;
    text-align: center;
}

.company_access .cmn_content{
    width: 100%;
    padding: 20px 3%;
    margin-top: 20px;
}



/* aaa ///////////////////////////////////// */



/* aaa ///////////////////////////////////// */



/* aaa ///////////////////////////////////// */



/* aaa ///////////////////////////////////// */



/* contact ///////////////////////////////////// */

/* contact_form */

.contact_form .cmn_dl > div dt,
.contact_form .cmn_dl > div dd{
    width: 100%;
}

.required {
    position: relative;
    margin-left: 30px;
    top: 10px;
    right: 0;
}

.contact_privacy{
    padding-left: 0;
    padding-right: 0;
}

.contact_privacy > div{
    padding: 30px 3%;
}




}
























@media (max-width: 560px) {

/* cmn ///////////////////////////////////// */

/* header */

/* cmn_tit */

.cmn_tit_1st h2{
    padding-top: 60px;
    background-size: auto 48px;
}

/* cmn_dl */

.cmn_dl > div dt{
    padding: 10px 10px 0;
}

.cmn_dl > div dd{
    padding: 10px;
}

/* cmn_itemlist */

.cmn_itemlist{
    grid-template-columns: repeat(2, 1fr);
}

/* cmn_contactbnr */

.cmn_contactbnr > div{
    width: 100%;
    height: auto;
    padding: 20px 3%;
}

.cmn_contactbnr > div > p > a{
    padding-left: 35px;
    background-size: 24px auto;
}

/* cmn_searchbox */

.search_cat{
    grid-template-columns: repeat(2, 1fr);
}

/* cmn_searchresults */

.cmn_searchresults dl > div{
    display: block;
    margin-top: 10px;
}

.cmn_searchresults dl > div > dt{
    margin-bottom: 5px;
}



/* home ///////////////////////////////////// */

/* home_mainimg */

.home_mainimg::before{
    background-size: 90% auto, cover;
    background-position: center center ,center;
}

/* home_news */

.home_news .cmn_dl_02 > div{
    display: block;
}

.home_news .cmn_dl_02 > div > dt{
    font-weight: 700;
}

.home_news .cmn_dl_02 > div > dd{
    padding-left: 0;
    border: none;
}

/* home_about */

.home_about .cmn_content h2{
    padding-left: 0px;
    padding-top: 60px;

    text-align: center;

    background-size: auto 48px;
    background-position: center top;
}

.marker_animation::before{
    bottom: 41px;
}

.home_about .cmn_content .cmn_btn a:nth-of-type(2){
    margin-left: 20px;
}

/* home_others */

.home_others .cmn_content > div{
    height: 230px;
    padding: 25px 6% 0;
}

.home_others .cmn_content > div h2 span{
    line-height: 36px;
}

.home_others .cmn_content > div:nth-of-type(1) h2 span{
    padding-left: 48px;
    background-size: auto 36px;
}

.home_others .cmn_content > div:nth-of-type(2) h2 span{
    padding-left: 64px;
    background-size: 48px auto;
}

/* news ///////////////////////////////////// */

.cmn_btn.news_back{
    margin-top: 30px;
}

/* column ///////////////////////////////////// */

.column_list ul{
    grid-template-columns: 1fr 1fr;
}


/* message ///////////////////////////////////// */

.message_mainimg > figure{
    width: 350px;
    right: auto;
    left: 50%;
    transform: translateX(-50%);
}

.message_point h2,
.message_delivery h2 span{
    padding-top: 60px;
    background-size: auto 48px;

    font-size: 2.2rem;
    letter-spacing: 0;
}

.message_point h2 span.deco{
    padding-left: 0;
    padding-right: 0;
}

.message_point h2 span.deco::before,
.message_point h2 span.deco::after{
    content: none;
}

.message_point ul li{
    display: block;
}

.message_point ul li > figure{
    width: 300px;
    margin: 0 auto;
}

.message_point ul li > div{
    width: 100%;
    margin-top: 50px;
}

.message_point ul li > div > h3::before{
    top: -50px;
    left: -10px;
}

.message_point ul li:nth-child(2n){
    flex-direction: row-reverse;
}




.message_delivery .cmn_content > div > div{
    width: 100%;
    max-width: 360px;
    height: 260px;
    padding: 30px 20px 0;

    letter-spacing: 0;
}

.message_delivery .cmn_content > div > div .cmn_btn{
    bottom: 20px;
}

/* items ///////////////////////////////////// */

/* item_detail */

.item_genre{
    display: block;
}

.item_genre_tag{
    margin-top: 5px;
}

.item_about_feature{
    padding: 20px 3%;
}

.item_about_feature .cmn_dl > div dt{
    padding: 10px 10px 0;
}

.item_about_feature .cmn_dl > div dd{
    padding: 10px;
}

.items_tips h2 span{
    padding-top: 60px;
    background-size: auto 48px;
}

/* company ///////////////////////////////////// */

.company_info .cmn_dl > div dt{
    padding: 10px 10px 0;
}

.company_info .cmn_dl > div dd{
    padding: 10px;
}

.company_access{
    padding-top: 108px;
}

/* contact ///////////////////////////////////// */

.contact_info_attention{
    line-height: 1.5;
    padding: 5px;
}

.contact_info .cmn_content > p > a{
    padding-left: 40px;

    background-size: auto 20px;
}

/* contact_form */

.contact_form .cmn_dl .select_box{
    width: 100%;
}

.contact_form .cmn_dl select{
    padding: 0 10px;
}

.contact_form .cmn_dl input[type="text"],
.contact_form .cmn_dl input[type="tel"],
.contact_form .cmn_dl input[type="fax"],
.contact_form .cmn_dl input[type="email"]{
    padding: 0 10px;
    width: 100%;
}

.reenter{
    display: block;
    text-align: right;
}

.contact_form .cmn_dl textarea{
    padding: 10px;
}


.contact_form .contact_btn_area{
    flex-direction: column;
    align-items: center;
}

.contact_form .contact_btn_area button:nth-of-type(2){
    margin-right: 0;
    margin-top: 20px;
}






}