/* 
    Created on : 2018/01/29, 15:04:31
    Author     : Hiroshi Iizuka
*/
/* COMMON
***********/
body{font-size: 16px;color: #33393b;line-height: 22px;background-color: #33393b;}
p,ul,ol{font-size: 0.8em;}
a{text-decoration: underline;cursor: pointer;}
a:hover{text-decoration: none; cursor: pointer;}
a.with_line{text-decoration: none;cursor: pointer;}
a.with_line:hover{text-decoration: underline;cursor: pointer;}

/* LAYOUT and DESIGN
*********************/
/* WRAPPER */
#wrapper{position: absolute; top: 0; left: 0; width: 100%;}
#wrapper{background-color:#faffff;}
/* HEADDER UPPER */
#header_upper{display: table; position: relative; top: 0; left: 0; width: 100%; height: 50px;}
#header_upper{background-color: #ffffff;font-size:0.9em;}
#header_upper a,#header_upper a:hover,#header_upper a:visited{color: #33393b;}

    /* HEADDER UPPER CONTENTS */
    #company_logo{display:table-cell; padding-left:8px;vertical-align: middle; width: 180px;color:#646464;}
    #company_logo a,#company_logo a:hover,#company_logo a:visited{text-decoration: none;color:#646464;}
    #company_logo_img{height: 40px;margin-top: 6px;}
    @media screen and (max-width: 780px){
        #header_upper{height: 48px;}
        #company_logo_img{height: 20px;margin-top: 8px;}
    }
    #link_to_offitial1,
    #link_to_offitial2{display:table-cell;vertical-align: middle; width: 100px;white-space: nowrap;}
    #space_cell{display:table-cell;vertical-align: middle; width: 24px;}
    #empty_cell{display:table-cell;vertical-align: middle; }
/* HEDDER UPPDER FOR SMART PHONE */
@media screen and (max-width: 780px){
    #header_upper{height: 25px;text-align: left;padding-right: 1em;}
    #link_to_offitial1,
    #link_to_offitial2,
    #space_cell,
    #empty_cell{display:none;}
}
/* HEADER LOWER */
#header_lower{display: table; position: relative; left: 0; width: 100%; height: 64px;padding: 0 8px;}
#header_lower{background-color: #33393b;}
#header_lower.fixed_top{z-index: 10; position: fixed; top: 0;box-shadow: 0 5px 10px rgba(51,57,59,0.4);}
#header_lower.unfixed_top{z-index: 0; position: relative;box-shadow: 0 0 0;}
    /* HEADER LOWER CONTENES */
    #burger{display:none;height: 100%;width: 80px;position: absolute;top:0;left:0;}
    #burger img{height: 24px;width: 30px;margin-top:20px;margin-left: 8px;}
    #cancel_icon{display: none;}
    #product_name{display: table-cell;vertical-align: middle; width: 100px;white-space: nowrap;}
    h1.product_name{font-size:1.2em;color: #ffffff;text-align:center;}
    p.edition_name{text-align: center; color: #ffffff;}
    #link_contents{display: table-cell;text-align: center;vertical-align: middle;font-size:0.9em;} /*JSでセンタリング*/
    @media screen and (max-width: 780px){
        #link_contents{display: none;}
        #product_name{width: 100%;}
        #burger{display:block;}
    }
    #link_contents a{color:#ffffff;}    
    #link_contents a:visited{color:#ffffff;}
    #right_empty_cell{}/*JSで.#product_nameの幅を複製*/
    @media screen and (max-width: 780px){
        #right_empty_cell{display: none;}
    }
    #link_contents_outer{display:inline-block;min-width: 648px;}
    .link_contents_inner{display:inline-block;}
    .link_contents_inner_space{display:inline-block; width: 1.0em;}
    
/* CATCH */
#catch{position: relative; left: 0; width: 100%;box-shadow: 0 5px 10px rgba(0,0,0,0.4);}
#catch{background-color: #33393b;}
    /* CATCH CONTENTS */
    #catch_contents{position: relative; top: 0; width: 100%; margin: 0 auto;padding-bottom: 12px;}
    @media screen and (min-width: 781px){
        #catch_contents{max-width: 1100px; min-width: 1100px; }
    }
    #catch_image{margin: 0 auto; width: 100%;opacity: 0;}
    #catch_copy_img1{position: absolute; width: 41.2%;opacity: 0;}
    #catch_copy_img2{position: absolute; width: 40.6%;opacity: 0;}
    @media screen and (max-width: 780px){
        #catch_copy_img1{width: 80.3%;}
        #catch_copy_img2{width: 79.1%;}
    }
    p.sub_catch_copy{color: #ffffff;margin-bottom: 12px;text-align: center;opacity: 0;}
    p.catch_copy{font-size:1.6em;line-height: 1.1em;color: #ffffff;text-align: center;opacity: 0;}
/* CONTENTS */
#contents{position: relative; left: 0; width: 100%; margin: 0 auto;}
#contents{background-color: inherit;}

    /* ARTICLE */
    .h2box{position: relative; left: 0; width: 100%;}
    @media screen and (max-width: 780px){
        .h2box{width: 98%; margin: 0 auto;}
    }
    @media print{
        #page_break{display: table;page-break-before: always;}
    }
    h2.article_title{font-size:1.8em;line-height: 3.0em;text-align: center;}
    @media screen and (max-width: 780px){
        h2.article_title{font-size:1.5em;line-height: 2.0em;text-align: left;font-weight: bold;}
    }
    .article_item,
    .article_item_for_fullwidth{position: relative; left: 0; width: 100%;margin-bottom: 8px;box-shadow: 0 3px 10px 0px rgba(51,57,59,0.4);}
    .article_item,
    .article_item_for_fullwidth{background-color: #ffffff;}
    .article_type1, .article_type2{} /* レスポンシブ切り替え用 */
    
    .h3box{position: relative; left: 0; width: 100%; margin-bottom: 1em;}
    .h3box_line{border-bottom: 1px solid #33393b;border-top: 1px solid #33393b;margin-top: 1em;background-color: #f9f9f9;}
    h3.article_child_title{font-size:1.5em; line-height: 1.3em;text-align: left;}
    @media screen and (max-width: 780px){
        h3.article_child_title{font-size:1.4em; line-height: 1.3em;text-align: left;}
    }
    .article_child{padding:12px 0;}
    .article_child_for_fullwidth{padding:12px 33px;}
    .article_child a{color:#0066cc}
    .article_child a:visited{color:#0066cc}
    .article_child_left,
    .article_child_fullwidth{position: relative;top:0;left: 0;background-color: #ffffff;}
    .article_child_right{position: absolute;top: 0;background-color: #ffffff;}
    .pbox, .ulbox, .olbox{position: relative; left: 0; width: 99%; padding-bottom: 1em;margin:0 auto;}
    .ulbox ul{list-style-type: disc;}
    .ulbox li{padding-left: 1em;text-indent: -1em;list-style-position: inside;}
    .pbox .align_right{text-align: right;}
    .pbox_end{padding-bottom: 0;}
    .article_child_body{text-align: left;}
    .img_box img{margin:0 auto;display:block;}
    
    /* INQUIRY BANNER */
    #inquiry_banner{width:85%; margin: 12px auto;}
    #onlineshop_banner{width:60%; margin: 12px auto;}
    
    /* RESPONSIVE */
    @media screen and (min-width: 781px){
        #contents{max-width: 1100px; min-width: 1100px; }
    }
    @media screen and (max-width: 780px){
        .article_child_right{position: relative;left:0;}
    }
    
    
/* FOOTER */
#footer{display: block; position: relative; top: 0; left: 0; width: 100%; padding: 16px 0;color: #999;}
#footer{background-color: #33393b;}
    #footer_body{display:block;margin: 0 auto;width: 95%;}
    @media screen and (min-width: 781px){
        #footer_body{max-width: 1100px; min-width: 1100px; }
    }
    #footer_body p{margin-top:12px;margin-bottom:12px;font-size:0.75em;}
    #footer_body a,
    #footer_body a:hover,
    #footer_body a:visited
    {color:#999;}
    #cm_link{text-align: center;}
 
/* RESPONSIVE NAVI */
#responsive_navi{background-color: #33393b;padding-left: 24px;padding-right: 24px;
                 position: absolute;left:-270px;
                 z-index: 10;box-shadow: 5px 5px 10px rgba(51,57,59,0.4);height: 100%;width: 200px;
}
#responsive_navi a,
#responsive_navi a:hover,
#responsive_navi a:visited{color:#ffffff;}
.responsive_navi_child{padding-top:8px;padding-bottom:8px;border-bottom: solid 1px #ffffff;margin-bottom: 16px;}
#responsive_navi.fixed_top{position: fixed; top: 64px;}
#responsive_navi.unfixed_top{position: absolute;}

/* common */
.mgn_top12{margin-top:12px;}
.mgn_btm12{margin-bottom:12px;}
.pdg_top2em{padding-top: 2em;}
.pdg_bottom2em{padding-bottom: 2em;}
.notice{font-size:0.7em;}/*注釈用*/
sup {
font-size: 50%;
vertical-align: top;
position: relative;
top: -0.5em;
}

/* TABLE */
.summery_table{display:table;border: solid 1px #33393b;margin: 16px auto;}
.summer_table_width{width: 97%;}
.summery_table_row
.summery_table_row2{display: table-row;}
.summery_table_row2{border-top: 1px solid #33393b;}
.thcell1,.thcell2{display: table-cell;padding: 8px;border: none;border-right: solid 1px #33393b;background-color: #f9f9f9;width: 30%;vertical-align: middle;}
.tdcell1,.tdcell2{display:table-cell;padding: 8px;border: none;vertical-align: middle;}
.tdcell3{display:table-cell;padding: 8px;border:none;border-left:solid 1px #33393b;vertical-align: middle;}
.tdcell1 ul,
.tdcell2 ul{list-style-type: disc;padding-left: 1.5em;}
.tdcell1 ul li,
.tdcell2 ul li{margin:8px 0;}
.form_thwidth{width:250px;}
.form_td1width{width:350px;}
.form_textwidth{width:95%;}

/* button */
.btnStyle{height: 50px;width: 150px; background-color: #f9f9f9;font-size:1.1em;border-radius: 8px;}
.btnStyle:hover{background-color: #f4f4f4;cursor: pointer;}

/* form validation */
.validation_comment{color:#f00;display:none;}