body{ font-family:"メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro", "Osaka","MS Pゴシック","MS PGothic","sans-serif","arial","helvetica"; line-height:1.4; font-size:13px; -webkit-text-size-adjust: 100%; word-wrap: break-word; } .qafont{ font-size:20px; padding:0 3px; } main { background:url(../img/background); } div #wrap a{ text-decoration:none; color:#f18e0f; } div #wrap a.img_opacity{ opacity:1; } /*----------------------------- brother_glovalheader_respd -------------------------------*/ html, body{ margin:0; padding:0; } #parentContainer{ max-width:960px; padding:0; margin:0 auto; } #globalheader .inner{ width:auto !important; max-width:92.4em; } /*----------------------------- responsive -------------------------------*/ .respd{ max-width: 100%; height: auto; width /***/:auto;  } /*-----------共通contents----------*/ .floatleft{ float:left; } .floatright{ float:right; } .align_left{ text-align:left; } .align_right{ text-align:right; } .align_center{ text-align:center; margin:auto; } .textalignleft{ text-align:left; } .clearfix:before, .clearfix:after { content: " "; display: table; } .clearfix:after { clear: both; } .clearfix { *zoom: 1; } i.fa{ margin-left:5px; } .mar_t10{ margin-top:10px; } .mar_h20{ margin:20px 0; } .mar_h30{ margin:30px 0; } .mar_b20{ margin-bottom:20px; } .mar_b50{ margin-bottom:50px; } /*-----------共通block----------*/ .footerarea{ background:#a0a0a0; min-height:100%; } .parentContainer { position: relative; max-width: 940px; margin: 30px auto 0px auto; } #container { width: 100%; margin: 0 auto; margin-top:40px; position: relative; padding-left:5px; } .contents_section{ max-width:100%; background:#fff; padding:40px; margin:40px 10px; /* box-shadow */ box-shadow:4px 4px 10px -6px #000000; -moz-box-shadow:4px 4px 10px -6px #000000; -webkit-box-shadow:4px 4px 10px -6px #000000; } .footerContainer{ padding:30px 10px; color:#ccc; width:100%; line-height:1.6em; } .footerContainer a{ color:#fff; text-decoration:none; } .footerbox_1{ float:left; width:27%; } .footerbox_2{ float:left; width:24%; } .footerbox_3{ float:left; width:22%; } .footerbox_4{ float:left; width:27%; } .itembox { margin-bottom: 10px; width: 300px; height:145px; } .copyrightarea{ border-top:#888 1px solid; text-align:center; padding:10px; font-size:11px; color:#666; } .itembox.hx2{ height:300px; } .item{ height:145px; width:145px; background:#ccc; padding:10px; position:relative; border:#fff 6px solid; /* box-shadow */ box-shadow:4px 4px 10px -6px #000000; -moz-box-shadow:4px 4px 10px -6px #000000; -webkit-box-shadow:4px 4px 10px -6px #000000; } .item.wx2{ width:300px; } .item.hx2{ height:300px; } .item a{ position:absolute; top:0; left:0; width:100%; height:100%; text-indent:-999px; z-index:100; background:#fff; opacity: 0; -ms-filter:"alpha(opacity=0)";/*ie8*/ transition: 0.6s; } .item a:hover{ opacity: 0.5 ; -ms-filter:"alpha(opacity=0.5)";/*ie8*/ } .caption_area{ position:absolute; z-index:10; bottom:6px; left:6px; font-size:11px; } /* .caption_area_center{ position:absolute; z-index:12; bottom:6px; font-size:11px; left: 0; right: 0; margin:0 auto; text-align:center; } .caption_area_right{ position:absolute; z-index:11; bottom:6px; right:6px; font-size:11px; } @media screen and (max-device-width: 1024px) { .caption_area_right{ position:absolute; z-index:11; bottom:-4px; right:6px; font-size:11px; margin-right: -1px; } .caption_area_right:after { content:''; margin-right:1px; } } */ .fontcolor_fff{ color:#fff; } .fontcolor_ccc{ color:#ccc; } .fontcolor_aaa{ color:#aaa; } .fontsize11{ font-size:11px; } .fontsize12{ font-size:12px; } ul.list_circle { list-style-type: circle; } ul.list_circle li { margin-left:1.4em; padding:3px 0; } .distable{ display:table; width:100%; table-layout: fixed; } .distable_cell{ display:table-cell; vertical-align:top; } .noteline{ line-height:26px; background:url(../img/other/noteline.gif); } .shadowbtn{ height:50px; text-align:center; margin:auto; width:100%; background:#555; padding:10px; position:relative; border:#fff 6px solid; color:#fff; position:relative; /* box-shadow */ box-shadow:4px 4px 10px -6px #000000; -moz-box-shadow:4px 4px 10px -6px #000000; -webkit-box-shadow:4px 4px 10px -6px #000000; } .shadowbtn a{ position:absolute; top:0; left:0; width:100%; height:100%; text-indent:-999px; z-index:100; background:#fff; color:#fff; opacity: 0; -ms-filter:"alpha(opacity=0)";/*ie8*/ transition: 0.6s; } .shadowbtn a:hover{ opacity: 0.5 ; -ms-filter:"alpha(opacity=0.5)";/*ie8*/ } .goldborder{ padding:20px; background:url(../img/other/goldborder.gif); } .goldborder_innerbox{ padding:50px; background:#fff; } @media screen and (max-width:850px){ .distable_cell{ display:table-cell; padding:10px; } } @media screen and (max-width:768px){ .goldborder_innerbox{ padding:30px; } } @media screen and (max-width:500px){ .distable_cell{ display:block; text-align:center; } } /*-----------card----------*/ #card1{ background:url(../img/other/card1.jpg) no-repeat center center; } #card2{ background:url(../img/other/card2.jpg) no-repeat center center; } #card3{ background:url(../img/other/card3.jpg) no-repeat center center; } #card4{ background:url(../img/other/card4.jpg) no-repeat center center; } #card5{ background:url(../img/other/card5.jpg) no-repeat center center; } #card6{ background:url(../img/other/card6.jpg) no-repeat center center; } #card7{ background:url(../img/other/card7.jpg) no-repeat center center; } #card8{ background:url(../img/other/card8.jpg) no-repeat center center; } #card9{ background:url(../img/other/card9.jpg) no-repeat center center; } #card10{ background:url(../img/other/card10.jpg) no-repeat center center; } #card11{ background:url(../img/other/card11.jpg) no-repeat center center; } #card12{ background:url(../img/other/card12.jpg) no-repeat center center; } #card13{ background:url(../img/other/card13.jpg) no-repeat center center; } #card14{ background:url(../img/other/card14.jpg) no-repeat center center; } #card15{ background:url(../img/other/card15.jpg) no-repeat center center; } #card16{ background:url(../img/other/card16.jpg) no-repeat center center; } #card17{ background:url(../img/other/card17.jpg) no-repeat center center; } #card18{ background:url(../img/other/card18.jpg) no-repeat center center; } #card19{ background:url(../img/other/card19.jpg) no-repeat center center; } #card20{ background:url(../img/other/card20.jpg) no-repeat center center; } #card21{ background:url(../img/other/card21.jpg) no-repeat center center; } #card22{ background:url(../img/other/card22.jpg) no-repeat center center; } #card23{ background:url(../img/other/card23.jpg) no-repeat center center; } #card24{ background:url(../img/other/card24.jpg) no-repeat center center; } #card25{ background:url(../img/other/card25.jpg) no-repeat center center; } #card26{ background:url(../img/other/card26.jpg) no-repeat center center; } #card27{ background:url(../img/other/card27.jpg) no-repeat center center; } #card28{ background:url(../img/other/card28.jpg) no-repeat center center; } @media screen and (max-width:970px){ .contents_section{ margin:15px; } } @media screen and (max-width:800px){ .contents_section{ padding:30px; } } @media screen and (max-width:768px){ .footerContainer{ padding:30px 20px; } .footerbox_1{ width:50%; } .footerbox_2{ width:50%; } .footerbox_3{ width:50%; } .footerbox_4{ width:50%; } } @media screen and (max-width:500px){ .contents_section{ padding:20px; } .footerbox_1{ width:100%; } .footerbox_2{ width:100%; } .footerbox_3{ width:100%; } .footerbox_4{ width:100%; } } /*-----------index以外の共通block----------*/ .page_title{ display:table; color:#555; font-size:25px; margin-bottom:20px; } .section_title{ font-weight:bold; margin-bottom:20px; padding:12px 15px; background:url(../img/title/stripe_gold.gif); } .decoration_l{ display:table-cell; width:6px; background:url(../img/title/titleline_l.gif) no-repeat bottom; } .decoration_c{ background:url(../img/title/titleline_c.gif) repeat-x bottom; padding:0 2px; } .decoration_r{ display:table-cell; width:6px; background:url(../img/title/titleline_r.gif) no-repeat bottom; } .bigbtn{ height:60px; width:60px; margin-top:20px; cursor:pointer; } .backbtn{ background:url(../img/btn/back.gif); } .backbtn_2{ background:url(../img/btn/back.gif); } .closebtn{ background:url(../img/btn/close.gif); } @media screen and (max-width:640px){ .page_title{ font-size:18px; } } /*-----------よくある質問の開閉箇所----------*/ #acMenu{ border-bottom:#ccc 1px solid; } .acMenu_item{ display:table; width:100%; padding:10px 0; border-top:#ccc 1px solid; } .qa_q{ background:url(../img/icon/qa_q.gif) no-repeat left; padding:7px 0 0 37px; min-height:31px; /*cursor:pointer;*/ color:#f18e0f; display: inline-block; } .qa_q_on{ background:url(../img/icon/qa_q_on.gif) no-repeat left; } .qa_a{ margin-left:37px; /*display:none;*/ } /*--------------- イベント・新着 ---------------*/ .feedin{ color:#955027; } .yearmenuarea{ display:table; } .yearmenuarea_line{ margin:10px 0 15px 0; background:url(../img/other/yearmenuarea_bottom.gif) repeat-x bottom; } .yearmenu{ display:table-cell; padding:3px; } .itemlist{ display:table; } .itemlist_cell{ display:table-cell; padding:4px 0; } .itemlist_cell_date{ width:85px; } .itemlist_cell_title{ padding-left:10px; } @media screen and (max-width:500px){ .itemlist{ width:100%; } .itemlist_cell{ display:block; } .itemlist_cell_date{ padding-bottom:0; } .itemlist_cell_title{ padding-left:0; /*border-bottom:#ccc 1px dashed;*/ margin-bottom:15px; } } /*--------------- イベント・新着 詳細 ---------------*/ .title_m{ font-size:16px; font-weight:bold; margin-bottom:3px; } .title_l{ font-size:20px; font-weight:bold; margin-bottom:5px; } .listtable{ width:100%; } .listicon{ padding-right:5px; } /*--------------- スキャンカットとは? ---------------*/ .aboutdiv{ width:720px; text-align:center; margin:auto; } .about_main_left{ width:350px; float:left; margin-top:40px; } .about_main_right{ float:right; } @media screen and (max-width:850px){ .aboutdiv{ width:100%; } .about_main_left{ width:100%; float:none; margin-top:0px; } .about_main_right{ float:none; text-align:center; margin-top:20px; } } /*--------------- 製品情報 ---------------*/ .compare3col{ max-width:232px; text-align:center; margin:auto; } .compare3col_text{ margin:10px 6px 20px 6px; text-align:left; } .to_compare_pdf{ font-size:16px; } .max780{ max-width:780px; } .pattern3col_l{ max-width:220px; float:left; } .pattern3col_c{ max-width:220px; text-align:center; margin:auto; } .pattern3col_r{ max-width:220px; float:right; } .pattern3col_title{ font-weight:bold; margin-bottom:7px; } .howtousediv{ width:50%; float:left; margin-bottom:30px; } .howtousediv_text{ padding-right:40px; text-align:left; margin-top:5px; } @media screen and (max-width:768px){ .howtousediv_text{ padding-right:30px; } } @media screen and (max-width:500px){ .pattern3col_l,.pattern3col_r{ max-width:220px; float:none; text-align:center; margin:auto; } .howtousediv{ width:100%; float:none; text-align:center; } } /*--------------- 動画紹介 ---------------*/ .movie_item{ display:table; width:100%; padding-bottom:30px; border-bottom:#dcd3b8 1px solid; margin-bottom:30px; } .movie_item_last{ padding-bottom:0; border-bottom:none; margin-bottom:0; } .movie_image{ display:table-cell; vertical-align:middle; width:190px; } .movie_desc{ display:table-cell; vertical-align:middle; } .movie_desc .title{ font-size:18px; margin-bottom:3px; } .movie_desc .new{ background:url(../img/icon/new.gif) no-repeat left center; padding-left:45px; } @media screen and (max-width:640px){ .movie_item{ display:block; } .movie_image{ display:block; vertical-align:middle; width:100%; } .movie_desc{ display:block; vertical-align:middle; } .movie_desc .title{ font-size:15px; } } @media screen and (max-width:450px){ .movie_desc .new{ background:url(../img/icon/new.gif) no-repeat left top; padding:20px 0 0 0; } }