@media screen and (max-width:960px){ /* 商品扉ページ ボックス横並び */ #main_area #m_contents_section .m_index_inner .m_category_unit .m_category_list_box, #main_area #m_contents_section .m_index_inner .m_category_unit3 .m_category_list_box { float:none; width:95%; margin-left:2% !important; margin-top:15px !important; } #main_area #m_contents_section .m_index_inner .m_category_unit .m_category_list_box_l { margin-top:15px; width:95%; margin-left:2% !important; } #main_area #m_contents_section .m_index_inner .m_category_unit .m_category_list_box_deposit_manual, #main_area #m_contents_section .m_index_inner .m_category_unit3 .m_category_list_box_deposit_manual { margin-top:15px !important; } #main_area #m_contents_section .m_index_inner .m_category_unit .m_category_list_box .m_category_title_boxarea a, #main_area #m_contents_section .m_index_inner .m_category_unit3 .m_category_list_box .m_category_title_boxarea a { width:642px; } #footer #f_section p.pagetop { right:2.5%; margin-left:0; } } @media screen and (max-width:640px){ body { -webkit-text-size-adjust:100%; } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- 00:ベーススタイル ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ img { height:auto; max-width:100%; /* min-width:10%; */ width:auto; border:0 none; } .w49per.side img { width:100% !important; } /* 180201 update start */ .spMt10 { margin-top: 10px !important; } .spMt15 { margin-top: 15px !important; } .spMt20 { margin-top: 20px !important; } /* 180201 update end */ .spMt20 { margin-top: 20px !important; } .pc { display: none; } .sp {display: block; } /*--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- 01:フレーム ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/ /*------------------------------ ヘッダー -------------------------------*/ #header { border-bottom:none; padding-bottom: 8px; } #header #h_section { width:100%; } #header #h_section #h_sitetitle_unit { margin:2% 0 0 2%; width:98%; } #header #h_section #h_navigation_unit { float:none; width:100%; } #header #h_section #h_navigation_unit .h_navigation_box01 { margin-right:10px; } #header #h_section #h_navigation_unit .h_navigation_box02 { margin-top:0; background:none; padding:0; float:right; } #header #h_section #h_navigation_unit .h_search_keyword_boxarea { width:99%; float:none; clear:both; margin:0 auto; } /* キーワード検索 */ #header #h_section #h_navigation_unit ul.h_search_type { float:none; width:99%; margin:5px 0 0 3px; } #header #h_section #h_navigation_unit .h_search_keyword_boxarea .h_search_keyword_boxsection { margin:0 auto; } /* サイトロゴ */ #header #h_section #h_sitetitle_unit p#h_logo img { width:80%; } /* 180201 update start */ #header #h_section #h_navigation_unit ul.h_etc_menu { display:none; } /* 180201 update end */ /* グローバルナビ */ #header #h_section #gnavi ul.gn_menu { display:none; position:absolute; top:52px; left:0; z-index:100; background:#ffffff; margin:0 auto; padding:0 0 15px; width:100%; border-top:1px #cccccc solid; border-left:none !important; } #header #h_section #gnavi ul.gn_menu li { float:none; border-bottom:1px #cccccc solid; border-radius:0; width:100%; margin:0 auto; position:relative; } #header #h_section #gnavi ul.gn_menu li a { border:none !important; display:block; width:auto; background:none; } #header #h_section #gnavi ul.gn_menu li.on a, #header #h_section #gnavi ul.gn_menu li a:hover { border-radius:0; color:#333333 !important; background:#ffffff; } #header #h_section #gnavi ul.gn_menu li a.gNaviRecruit { background:url(../image/gnavi_icon_window.gif) 96% 50% no-repeat !important; } #header #h_section #gnavi ul.gn_menu li span { position:absolute; top:3px; right:2.5%; cursor:pointer; display:block; border:none !important; padding:5px; } #header #h_section #gnavi ul.gn_menu li span img { /* width:75%; */ } #header #h_section #gnavi ul.gn_menu li a.gNaviRecruit img { display:none; } #header #h_section #gnavi ul.gn_menu li ul { border:none !important; width:90%; padding:0 5%; display:none; } #header #h_section #gnavi ul.gn_menu li ul li { border-top:1px #cccccc dotted; border-bottom:none; font-size:85%; } #header #h_section #gnavi ul.gn_menu li ul li a { background:url(../image/arrow03.gif) 97% 50% no-repeat; } #header #h_section #gnavi ul.gn_menu li ul li a:hover { background:url(../image/arrow03.gif) 97% 50% no-repeat; } /* 180201 update start */ #header #h_section #gnavi ul.gn_menu li a.gNaviSubLink { background:url(../image/arrow03.gif) 95% 50% no-repeat !important; display:block; } #header #h_section #gnavi ul.gn_menu li ul li.btnLink a { color:#ba911f !important; } /* 180201 update end */ /* 210610 update start */ #header #h_section #gnavi ul.gn_menu li#spMenuFixed { display: block; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed > div { display: none; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal { } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea { width: 95%; box-sizing: border-box; margin: 20px auto; border: solid 5px #d6dcdf; border-radius: 3px; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea a { background: none; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea div { text-align: center; padding: 15px 2% 0; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea div img { width: 17%; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea div span { position: static; padding: 0; font-weight: bold; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea div > span { display: block; font-size: 114%; margin-top: 5px; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea div span span { font-size: 68%; display: block; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea ul { margin: 10px auto 0; display: flex; justify-content: space-between; padding-bottom: 15px; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea ul li { margin: 0 auto; width: 46%; border: none; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea ul li:first-child { margin-top: 0; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea ul li a { border: solid 1px #cccccc !important; padding: 0; height: 50px; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea ul li:first-child a { border: none !important; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea ul li a.btn span { width: 100%; box-sizing: border-box; transition: all 0s; position: static; padding: 8px; text-align: center; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea ul li#loginBtn a { color: #ffffff !important; background: #d8212c url(https://www.hokugin.co.jp/common/images/header_icon_win.gif) no-repeat 95% center; text-align: center; font-weight: bold; padding: 0; box-sizing: border-box; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea ul li#loginBtn a:hover { opacity: 0.7; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea ul li#loginBtn a span { position: static; display: block; background: url(https://www.hokugin.co.jp/common/images/header_icon_login.gif) no-repeat 10% center / 10px; padding: 17px 15px; box-sizing: border-box; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea #balance_link { background: #ffffff; text-align: center; border-top: solid 5px #d6dcdf; padding: 0 2%; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea #balance_link a { display: block; padding: 5px; color: #000000; text-decoration: none; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea #balance_link a:hover { text-align: center; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea #balance_link a img { width: 35px; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spPersonal .personalArea ul li a:hover.btn span { color: #000000; background: #ffffff; opacity: 0.6; text-align: center; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spBusiness .businessArea { margin: 15px 5% 0; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spBusiness .businessArea div a { padding: 0; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spBusiness .businessArea ul { width: 100%; padding: 0; margin: 15px auto 20px; display: flex; justify-content: space-between; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spBusiness .businessArea ul li { width: 30%; border: none; margin: 0; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed #spBusiness .businessArea ul li a { background: none; padding: 0; border: solid 1px #adb5bd !important; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed ul.splList { border-top: 1px #cccccc solid !important; width: 100%; padding: 0; flex-wrap: wrap; display: flex;justify-content: flex-start; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed ul.splList li#listKouza { width: 100%; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed ul.splList li#listKouza a { font-size: 150%; padding: 15px; font-weight: bold; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed ul.splList li#listKouza a span { position: static; display: block; background: url(../image/header_img_kouza.gif) no-repeat left center / contain; padding-left: 17%; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed ul.splList li { border-bottom: 1px #cccccc solid; border-top: none; width: 50%; margin: 0; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed ul.splList li a { display: block; background: url(../image/arrow27.png) no-repeat 97% center; padding: 15px 10px; box-sizing: border-box; text-align: left; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed ul.splList li:nth-child(2n) { border-right: 1px #cccccc solid; box-sizing: border-box; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed ul.splList li:last-child { border-bottom: none; } #header #h_section #gnavi ul.gn_menu li#spMenuFixed ul.splList li:nth-last-child(2) { border-bottom: none; } #header #h_section #gnavi ul.gn_menu li.on a, #header #h_section #gnavi ul.gn_menu li a:hover { text-align: left; } #header #h_section #gnavi ul.gn_menu > li > a { font-size: 129%; padding: 15px; font-weight: bold; text-align: left; } #header #h_section #gnavi ul.gn_menu { border-bottom: 1px #cccccc solid; padding: 0; } #header #h_section #gnavi ul.gn_menu > li.subList { width: 50%; float: left; box-sizing: border-box; } #header #h_section #gnavi ul.gn_menu > li.subList:nth-of-type(2n+1) { border-right: 1px #cccccc solid; } #header #h_section #gnavi ul.gn_menu > li:last-child { border-bottom: none; } #header #h_section #gnavi ul.gn_menu > li.subList a { font-size: 100%; } #header #h_section #gnavi ul.gn_menu > li.subList a.gNaviSubLink { background: url(../image/arrow27.png) no-repeat 97% center !important; } #header #h_section #gnavi ul.gn_menu > li.subList a.gNaviRecruit { background: url(../image/icon_win.png) no-repeat 97% center !important; } #header #h_section #gnavi ul.gn_menu li span { top: 9px; } #header #h_section #gnavi ul.gn_menu li ul.childList { width: 100%; padding: 0 0 20px; border-top: 1px #cccccc solid !important; } #header #h_section #gnavi ul.gn_menu li ul.childList > li { border: none; } #header #h_section #gnavi ul.gn_menu li ul.childList li a, #header #h_section #gnavi ul.gn_menu li ul.childList li a:hover { background: url(../image/arrow27.png) no-repeat 97% center; } #header #h_section #gnavi ul.gn_menu li ul.childList > li a { text-align: left; } #header #h_section #gnavi ul.gn_menu li ul.childList > li > a { padding: 15px 0; margin: 0 15px; border-top: solid 1px #ccc !important; } #header #h_section #gnavi ul.gn_menu li ul.childList > li:first-child > a { border-top: none !important; } #header #h_section #gnavi ul.gn_menu li ul.childList > li { margin: 10px 3% 0; width: 94%; padding: 5px 13px; background: #f4f4f7; box-sizing: border-box; border: solid 1px #dfdfdf; border-radius: 5px; } #header #h_section #gnavi ul.gn_menu li ul.childList > li > a { background: none; font-size: 140%; font-weight: bold; padding-left: 40px; } #header #h_section #gnavi ul.gn_menu li ul.childList > li span { top: 15px; } #header #h_section #gnavi ul.gn_menu li ul.childList > li > a { border-top: none !important; margin: 0; } #header #h_section #gnavi ul.gn_menu li ul.childList > li.noneChild > a { background: url(../image/arrow27.png) no-repeat right center; padding-left: 0; } #header #h_section #gnavi ul.gn_menu li ul.childList > li a#personalSave { background: url(../image/header_icon_personal_save.gif) no-repeat left center / 33px; } #header #h_section #gnavi ul.gn_menu li ul.childList > li a#personalIncrease { background: url(../image/header_icon_personal_increase.gif) no-repeat left center / 33px; } #header #h_section #gnavi ul.gn_menu li ul.childList > li a#personalLoan { background: url(../image/header_icon_personal_loan.gif) no-repeat left center / 33px; } #header #h_section #gnavi ul.gn_menu li ul.childList > li a#personalOther { background: url(../image/header_icon_personal_other.gif) no-repeat left center / 33px; } #header #h_section #gnavi ul.gn_menu li ul.childList > li a#personalLifeplan { padding-left: 0; } #header #h_section #gnavi ul.gn_menu li ul.childList > li a#businessFinance { background: url(../image/header_icon_business_finance.gif) no-repeat left center / 33px; } #header #h_section #gnavi ul.gn_menu li ul.childList > li a#businessManagement { background: url(../image/header_icon_business_management.gif) no-repeat left center / 33px; } #header #h_section #gnavi ul.gn_menu li ul.childList > li a#businessExchange { background: url(../image/header_icon_business_exchange.gif) no-repeat left center / 33px; } #header #h_section #gnavi ul.gn_menu li ul.childList > li a#businessAbroad { background: url(../image/header_icon_business_abroad.gif) no-repeat left center / 37px; } #header #h_section #gnavi ul.gn_menu li ul.childList > li a#businessIib { background: url(../image/header_icon_business_ib_eb.gif) no-repeat left center / 37px; } #header #h_section #gnavi ul.gn_menu li#aboutList ul.childList > li.hasChild > a { padding-left: 0; } #header #h_section #gnavi ul.gn_menu li ul.childList > li ul { padding: 0; width: 100%; margin-bottom: 5px; } #header #h_section #gnavi ul.gn_menu li ul.childList > li ul li { margin-top: 5px; border: 1px #cccccc solid; background: #ffffff; font-size: 117%; } #header #h_section #gnavi ul.gn_menu li ul.childList > li ul li a { } /* 210610 update end */ #header #h_section #h_navigation_unit p.h_search_office_atm { float:none; position:absolute; top:3px; right:7%; /* padding:7px; background:none #d60b17; border-radius:3px; */ width:20%; } #header #h_section #h_navigation_unit p.h_search_office_atm:hover { opacity:0.7; filter:alpha(opacity=70); } #header #h_section #gnavi p { display:block; position:absolute; top:3px; right:3px; /* background:none #d60b17; border-radius:3px; */ width:6.8%; } #header #h_section #gnavi p:hover { opacity:0.7; filter:alpha(opacity=70); } #header #h_section #gnavi p a { /* display:block; padding:7px; color:#fff; text-decoration:none; */ } #header #h_section #gnavi p span { position:absolute; bottom:-7px; left:45%; display:none; } /* 210514 追記 */ #header #h_section #h_navigation_unit p.h_search_office_atm { z-index: 12; } #header #h_section #gnavi p { z-index: 12; } /* 210514 追記 */ /* グローバルサブナビ */ #sub_header { display:none; } /*------------------------------ パンくずナビ -------------------------------*/ #pan_area { /* display:none; */ } /*------------------------------ コンテンツ -------------------------------*/ #main_area #pan_area { width:100%; } #main_area #m_contents_section { width:100%; float:none; } #main_area #m_contents_section #m_h1_inner { margin-bottom:15px; } #main_area #m_contents_section .m_tabselector_inner ul li { border-top-left-radius:5px; border-top-right-radius:5px; } #main_area #m_contents_section .m_tabselector_inner ul li a { border-top-left-radius:5px; border-top-right-radius:5px; } #main_area #m_contents_section .m_content_inner { padding:20px 10px;} #main_area #m_contents_section .m_content_inner .m_point_box01 ul li { padding:0.3em 0 0.7em 5.5em; } #main_area #m_contents_section .m_content_inner .m_point_box02 ul li { padding:0.3em 0 0.7em 5.5em; } /* 160915変更開始 */ /* タブセレクタ */ #main_area #m_contents_section .m_tabselector_inner ul li:hover { /* background:none #ffffff; color:#000000; */ } #main_area #m_contents_section .m_tabselector_inner ul li.on:hover { /* background:none #d60b17; color:#ffffff; */ } #main_area #m_contents_section .m_tabselector_inner ul li a:hover { background:none #ffffff; color:#000000 !important; } #main_area #m_contents_section .m_tabselector_inner ul li.on a:hover { background:none #d60b17; color:#ffffff !important; } /* 160915変更終了 */ /* write210326 */ #main_area #m_contents_section h2.redline { width:96%; margin:40px auto 0; } /* write210326 end */ /*------------------------------ サイド -------------------------------*/ #main_area #lnavi { float:none; width:95%; margin:20px auto 0; } #main_area #lnavi #ln_banking_inner img, #main_area #lnavi h3 img, #main_area #lnavi p img { width:100%; } /* インターネットバンキング */ #main_area #lnavi #ln_banking_section #ln_banking_inner p { float:left; width:48%; } #main_area #lnavi #ln_banking_section #ln_banking_inner ul { float:right; width:48%; margin-top:0 !important; } #main_area #lnavi #ln_banking_section #ln_banking_inner ul li:first-child { margin-top:0; } #main_area #lnavi #ln_banking_section #ln_banking_inner03 .ln_links02 li { width:100%; margin-top:6px; } #main_area #lnavi #ln_banking_section #ln_banking_inner02 p { margin-top: 3px;} #main_area #lnavi #ln_banking_section #ln_banking_inner02 ul { margin-top:0 !important; } #main_area #lnavi #ln_banking_section #ln_banking_inner02 ul li:first-child { margin-top:0; } #main_area #lnavi #ln_banking_section #ln_banking_inner03 p { float:left; width:48%; } #main_area #lnavi #ln_banking_section #ln_banking_inner03 ul { float:right; width:48%; margin-top:0 !important; } #main_area #lnavi #ln_banking_section #ln_banking_inner03 ul li:first-child { margin-top:0; } #main_area #lnavi #ln_banking_section #ln_banking_inner04 p { float:left; width:48%; } #main_area #lnavi #ln_banking_section #ln_banking_inner04 ul { float:right; width:48%; margin-top:0 !important; } #main_area #lnavi #ln_banking_section #ln_banking_inner04 ul li:first-child { margin-top:0; } /* 170906変更 */ /* サイドバナー */ #main_area #lnavi ul#m_side_banner_list li { float:left; width:49%; margin:7px 0 0 1.5%; } #main_area #lnavi ul#m_side_banner_list li#koza_apply { float:none; width:100%; margin:10px 0 0; } #main_area #lnavi ul#m_side_banner_list li#search_office { margin:7px 0 0; } #main_area #lnavi ul#m_side_banner_list li#search_gps { margin:7px 0 0 1.5%; display:block; } #main_area #lnavi ul#m_side_banner_list li#address_change { margin:7px 0 0 0; } #main_area #lnavi ul#m_side_banner_list li#first_person { margin:7px 0 0 1.5%; } /* 170906変更 */ /* 210106変更 */ /* ビジネスポータル */ #main_area #lnavi #business_portal_section { padding:3% 0 4%; } #main_area #lnavi #business_portal_section img { width:90%; } #main_area #lnavi #business_portal_section p { margin-left:2%; } #main_area #lnavi #business_portal_section li { margin-top:2%; } /* 210106変更 */ /* 200907追加 */ /* インターネットバンキング */ /* #main_area #lnavi #m_side_banking_inner { background:#a71779; padding-bottom:10px; } #main_area #lnavi #m_side_banking_inner #m_side_banking_unit h4 { margin-top:2%; } #main_area #lnavi #m_side_banking_inner #m_side_banking_unit h4 img { width:80%; } #main_area #lnavi #m_side_banking_inner #m_side_banking_unit h4 + p { float:left; width:50%; padding:2% 1.5% 0 3%; box-sizing:border-box; } #main_area #lnavi #m_side_banking_inner #m_side_banking_unit h4 + p img { width:100%; } #main_area #lnavi #m_side_banking_inner #m_side_banking_unit .side_links01 { width:50%; padding:2% 3% 0 1.5%; box-sizing:border-box; float:left; } #main_area #lnavi #m_side_banking_inner #m_side_banking_unit .side_links01 img { width:100%; } #main_area #lnavi #m_side_banking_inner #m_side_banking_unit .side_links02 { margin-left:0; } #main_area #lnavi #m_side_banking_inner #m_side_banking_unit .side_links02 li {width:46%; padding:3%; box-sizing:border-box; margin:4% 0 1% 1%; } #main_area #lnavi #m_side_banking_inner #m_side_banking_unit .side_links02 li:first-child {background:#fbc4df; margin:4% 1% 1% 3%; } #main_area #lnavi #m_side_banking_inner #m_side_banking_unit .side_links02 img { width:100%; } */ /* write210513 */ #main_area #lnavi #side_cs_ib { font-size:100%; } #main_area #lnavi #side_cs_ib #balance_link img { width:35px; } #main_area #lnavi #side_biz_links1 ul { display:flex; flex-wrap: wrap; } #main_area #lnavi #side_biz_links1 ul li { width: 50%; } #main_area #lnavi #side_biz_links1 ul li a { background-size: 10px; } #main_area #lnavi #side_biz_links2 ul { display:flex; justify-content: space-between; margin:2% 0 6%; } #main_area #lnavi #side_biz_links2 ul li { width: 31%; } /* write210513end */ /*------------------------------ フッター -------------------------------*/ /*------------------------------ bottomList -------------------------------*/ #footerGnaviWrap ul { padding: 20px 20px 0; flex-wrap: wrap; } #footerGnaviWrap ul li { width: 47%; height: 56px; } #footerGnaviWrap ul li:nth-child(n+3) { margin-top: 10px; } #footerGnaviWrap ul li a { display: block; height: 100%; padding: 0; position: relative; } #footerGnaviWrap ul li a span { position: absolute; top: 50%; left: 0; right: 0; transform: translateY(-50%); } #footerGnaviWrap #readSpeakerArea { padding: 20px; box-sizing: border-box; } #footerGnaviWrap #readSpeakerArea #readSpeakerBox { float: none; margin: 0; } /* ここから削除 */ #footer_gnavi_wrap { display:block; margin-top:10px; } #footer_gnavi_wrap ul { } #footer_gnavi_wrap ul li { float:left; width:48%; margin:8px 0 0 1.35%; } /* 180201 update start */ #footer_gnavi_wrap #readSpeakerArea { width:96%; float: none; margin:20px auto 0; } #footer_gnavi_wrap #readSpeakerArea #readSpeakerBox { float: none; margin-right:0; } /* 180201 update end */ /* ここから削除 */ #footer_wrap { margin-top:0; } #footer #f_section { width:100%; } #footer #fnavi { width:95%; } #footer #f_logo_section { width:95%; } #footer #f_copyright_section { width:100%; } #footer #fnavi #fn_top_section { margin:10px 0 0 0; } #footer #fnavi #fn_top_section .fn_top_inner .sitemap_unit { float:none; width:100% !important; margin-left:0; } #footer2 p#footer_sitemap_btn { padding: 10px 0; } #f_chara { width: 27%; right: 1%; } #footer2 #fsitemap_section { width:95%; } #footer2 #fsitemap_section .fn_top_inner { margin-top:0; } #footer2 #fsitemap_section .fn_top_inner .sitemap_unit { float:none; width:100%; margin-left:0; } #footer2 #fsitemap_section .fn_top_inner.etc_menu .sitemap_unit { width:100%; } #footer2 #fsitemap_section .fn_top_inner .sitemap_unit ul li img { width:auto; } /* 180806 update start */ #footer #f_section p.pagetop { bottom:15px; } #footer #f_section p.pagetop.pos_abs { bottom:-180px; position:absolute; } /* 180806 update end */ #footer #f_copyright_section p.footer_remarks { font-size: 79%; } #footer #f_copyright_section p.footer_copyright img { width: auto; } /*------------------------------ その他 -------------------------------*/ /* 囲みボックス01 */ #main_area #m_contents_section .m_content_inner .m_boxed_box01 span.m_etc_mbtn { display:block; margin-left:0; } #main_area #m_contents_section .m_content_inner .m_boxed_box01 span.m_etc_mbtn a { width:100%; max-width:200px; } /* 囲みボックス02 */ #main_area #m_contents_section .m_content_inner .m_boxed_box02 p.m_boxed_text { float:none; width:100%; } #main_area #m_contents_section .m_content_inner .m_boxed_box02 p.m_boxed_btn { float:none; width:100%; text-align:center; } /* PDFボタンver. */ #main_area #m_contents_section .m_content_inner .m_boxed_box02 p.m_boxed_pdf_btn { float:none; width:100%; text-align:center; } /* 囲みボックス03 */ #main_area #m_contents_section .m_content_inner .m_boxed_box03 span.m_etc_mbtn { display:block; margin-left:0; } #main_area #m_contents_section .m_content_inner .m_boxed_box03 span.m_etc_mbtn a { width:100%; max-width:200px; } /* 囲みボックス04 */ #main_area #m_contents_section .m_content_inner .m_boxed_box04 span.m_etc_mbtn { display:block; margin-left:0; } #main_area #m_contents_section .m_content_inner .m_boxed_box04 span.m_etc_mbtn a { width:100%; max-width:200px; } /* 囲みボックス07(白縁) */ #main_area #m_contents_section .m_content_inner .m_boxed_box07 .m_boxed_boxinner .f_left { float:none; margin:0 auto; width:60% !important; } #main_area #m_contents_section .m_content_inner .m_boxed_box07 .m_boxed_boxinner .f_right { float:none; margin:20px auto 0; text-align:center; width:70% !important; } /* 2分割囲みボックス */ #main_area #m_contents_section .m_content_inner .m_divide_boxed_box .m_divide_boxed_left { float:none; width:auto; } #main_area #m_contents_section .m_content_inner .m_divide_boxed_box .m_divide_boxed_right { float:none; width:auto; margin-top:5px; } /* 2分割矢印付きボックス */ #main_area #m_contents_section .m_content_inner .m_arrow_box { background:url(../image/arrow15.gif) no-repeat center; margin:20px 0;} #main_area #m_contents_section .m_content_inner .m_arrow_box .m_arrow_box_left { width:38%; float:left; padding:8px 15px 15px 15px; border:1px #cfcfcf solid;} #main_area #m_contents_section .m_content_inner .m_arrow_box .m_arrow_box_right { width:38%; float:right; padding:8px 15px 15px 15px; border:1px #cfcfcf solid;} /* ピックアップ2分割ボックス */ #main_area #m_contents_section .m_pickup_divide_box { width:98%; } #main_area #m_contents_section .m_pickup_divide_box.f_left { float:none; } #main_area #m_contents_section .m_pickup_divide_box.f_right { float:none; } #main_area #m_contents_section .m_pickup_divide_box .m_pickup_divide_boxarea .m_pickup_divide_boxinner .f_left { width:50%; } #main_area #m_contents_section .m_pickup_divide_box .m_pickup_divide_boxarea .m_pickup_divide_boxinner .f_right { width:50%; } /* お問い合わせボックス */ #main_area #m_contents_section .m_content_inner .m_inquiry_box .m_inquiry_boxarea { background:none; margin-bottom:0;} #main_area #m_contents_section .m_content_inner .m_inquiry_box .m_inquiry_boxarea p.m_etc_lbtn {margin-bottom: 20px;} #main_area #m_contents_section .m_content_inner .m_inquiry_box .m_inquiry_boxarea .m_inquiry_boxinner p { text-align:center; } #main_area #m_contents_section .m_content_inner .m_inquiry_box .m_inquiry_boxarea p.m_inquiry_subtitle { /* text-align:left; */ } #main_area #m_contents_section .m_content_inner .m_inquiry_box .m_inquiry_boxarea .m_inquiry_left_boxsection { float:none; width:100%; } #main_area #m_contents_section .m_content_inner .m_inquiry_box .m_inquiry_boxarea .m_inquiry_right_boxsection { float:none; width:100%; } #main_area #m_contents_section .m_content_inner .m_inquiry_box .m_inquiry_boxarea .m_inquiry_boxinner { height:auto !important; } #main_area #m_contents_section .m_content_inner .m_inquiry_box .m_inquiry_boxarea .m_inquiry_boxinner img { margin-top:0;} /* お問い合わせボックス02 */ #main_area #m_contents_section .m_content_inner .m_inquiry_box02 .m_inquiry_boxarea { background:none; margin-bottom:0;} #main_area #m_contents_section .m_content_inner .m_inquiry_box02 .m_inquiry_boxarea p.m_etc_lbtn { margin-bottom: 20px;} #main_area #m_contents_section .m_content_inner .m_inquiry_box02 .m_inquiry_boxarea .m_inquiry_boxinner p { text-align:center; } #main_area #m_contents_section .m_content_inner .m_inquiry_box02 .m_inquiry_boxarea .m_inquiry_left_boxsection { float:none; width:100%; } #main_area #m_contents_section .m_content_inner .m_inquiry_box02 .m_inquiry_boxarea .m_inquiry_right_boxsection { float:none; width:100%; } #main_area #m_contents_section .m_content_inner .m_inquiry_box02 .m_inquiry_boxarea .m_inquiry_boxinner { height:auto !important; } #main_area #m_contents_section .m_content_inner .m_inquiry_box02 .m_inquiry_boxarea .m_inquiry_boxinner p.mtb35_pc { margin-top:10px; margin-bottom:0px;} /* お問い合わせボックス03 */ #main_area #m_contents_section .m_content_inner .m_inquiry_box03 .m_inquiry_boxarea { background:none; margin-bottom:0;} #main_area #m_contents_section .m_content_inner .m_inquiry_box03 .m_inquiry_boxarea p.m_etc_lbtn { margin-bottom: 20px;} #main_area #m_contents_section .m_content_inner .m_inquiry_box03 .m_inquiry_boxarea .m_inquiry_boxinner p { text-align:center; } #main_area #m_contents_section .m_content_inner .m_inquiry_box03 .m_inquiry_boxarea .m_inquiry_left_boxsection { float:none; width:100%; } #main_area #m_contents_section .m_content_inner .m_inquiry_box03 .m_inquiry_boxarea .m_inquiry_right_boxsection { float:none; width:100%; } #main_area #m_contents_section .m_content_inner .m_inquiry_box03 .m_inquiry_boxarea .m_inquiry_boxinner { height:auto !important; } /* お問い合わせボックス（扉ページ） */ #main_area #m_contents_section .m_index_inner .m_inquiry_box .m_inquiry_boxarea, #main_area #m_contents_section .m_inquiry_box02 .m_inquiry_boxarea, #main_area #m_contents_section .m_inquiry_box .m_inquiry_boxarea{ background:none; margin-bottom:0;} #main_area #m_contents_section .m_index_inner .m_inquiry_box .m_inquiry_boxarea p.m_etc_lbtn, #main_area #m_contents_section .m_inquiry_box02 .m_inquiry_boxarea p.m_etc_lbtn, #main_area #m_contents_section .m_inquiry_box .m_inquiry_boxarea p.m_etc_lbtn{margin-bottom: 20px;} #main_area #m_contents_section .m_index_inner .m_inquiry_box .m_inquiry_boxarea .m_inquiry_boxinner p { text-align:center; } #main_area #m_contents_section .m_index_inner .m_inquiry_box .m_inquiry_boxarea p.m_inquiry_subtitle { /* text-align:left; */ } #main_area #m_contents_section .m_index_inner .m_inquiry_box .m_inquiry_boxarea .m_inquiry_left_boxsection, #main_area #m_contents_section .m_inquiry_box02 .m_inquiry_boxarea .m_inquiry_left_boxsection, #main_area #m_contents_section .m_inquiry_box .m_inquiry_boxarea .m_inquiry_left_boxsection{ float:none; width:100%; } #main_area #m_contents_section .m_index_inner .m_inquiry_box .m_inquiry_boxarea .m_inquiry_right_boxsection, #main_area #m_contents_section .m_inquiry_box02 .m_inquiry_boxarea .m_inquiry_right_boxsection, #main_area #m_contents_section .m_inquiry_box .m_inquiry_boxarea .m_inquiry_right_boxsection{ float:none; width:100%; } #main_area #m_contents_section .m_index_inner .m_inquiry_box .m_inquiry_boxarea .m_inquiry_boxinner { height:auto !important; } #main_area #m_contents_section .m_index_inner .m_inquiry_box .m_inquiry_boxarea .m_inquiry_boxinner img { margin-top:0;} /* 赤ボタン */ p.m_important_lbtn, p.m_important_mbtn, p.m_important_sbtn { text-align:center;} p.m_important_lbtn a, p.m_important_mbtn a, p.m_important_sbtn a { max-width:none; width:90%; } span.m_important_lbtn, span.m_important_mbtn, span.m_important_sbtn { text-align:center; display:block; margin-top:10px; margin-left:0 !important; } span.m_important_lbtn a, span.m_important_mbtn a, span.m_important_sbtn a { max-width:none; width:90%; } /* 黄ボタン */ p.m_etc_lbtn, p.m_etc_mbtn, p.m_etc_sbtn { text-align:center;} p.m_etc_lbtn a, p.m_etc_mbtn a, p.m_etc_sbtn a { max-width:none; width:90%; } span.m_etc_lbtn, span.m_etc_mbtn, span.m_etc_sbtn { text-align:center;} span.m_etc_lbtn a, span.m_etc_mbtn a, span.m_etc_sbtn a { max-width:none; width:90%; } /* グラデボタン */ p.m_gra_lbtn, p.m_gra_mbtn, p.m_gra_sbtn { text-align:center;} p.m_gra_lbtn a, p.m_gra_mbtn a, p.m_gra_sbtn a { max-width:none; width:90%; } span.m_gra_lbtn, span.m_gra_mbtn, span.m_gra_sbtn { text-align:center;} span.m_gra_lbtn a, span.m_gra_mbtn a, span.m_gra_sbtn a { max-width:none; width:90%; } /* 横並び2列黄ボタン */ ul.m_two_etc_btn li { width:100%; float:none; margin:10px 0 0 0; } ul.m_two_etc_btn li:first-child { margin-top:0; } ul.m_two_etc_btn_anchor li { width:100%; float:none; margin:10px 0 0 0; } ul.m_two_etc_btn_anchor li a { width:1%; } ul.m_two_etc_btn_anchor li:first-child { margin-top:0; } /* 横並び3列ボタン */ ul.m_three_btns li { float:none; width:auto; margin-top:10px; margin-left:0; } ul.m_three_btns li a { display:block; width:auto; } ul.m_divide_etc_btn li a { padding:8px 15px 8px 10px; width:auto; } /* 横並び3列黄ボタン */ ul.m_three_etc_btn li { float:none; width:100%; } ul.m_three_etc_btn li a { width:1.3%; } /* 横並び1列ボタン */ p.m_one_btns a { width:100%;} #main_area .m_withcity_section .m_withcity_bt_box p.m_one_btns a { width:95%;} /* 横並び2列ボタン */ ul.m_two_btns li { width:100%; margin-left:0; margin-top:10px; float:none; } ul.m_two_btns li:first-child { margin-top:0; } ul.m_two_btns li a { width:1.5%; } ul.m_two_btns02 li { width:100%; margin-left:0; margin-top:10px; float:none; } ul.m_two_btns02 li:first-child { margin-top:0; } ul.m_two_btns02 li a { width:1.5%; } p.btn_center span.m_etc_lbtn { margin-top:15px; display:block; margin-left:0 !important;} p.btn_center span.m_etc_lbtn:first-child { margin-top:0px;} /* 横並び2列ボタン(ページャー) */ ul.m_two_btns li.m_two_btns_prev a { width:1.5%;} ul.m_two_btns li.m_two_btns_next a { width:1.5%;} /* シンプルボタン(中央) */ p.m_one_plane_btn { width:100%; } /* 横並び2列ボタン(ミックス シンプルボタン+pdfボタン) */ .m_two_btns_mix_box p.m_left_plane_btn { float:none; width:100%; margin-top:10px !important; } .m_two_btns_mix_box p.m_right_pdf_btn { float:none; width:100%; margin: 10px auto 0 !important; } .m_two_btns_mix_box p.m_right_pdf_btn a img { vertical-align:middle; } /* 横並び2列ボタン(シンプルボタン) */ ul.m_two_plane_btns li.m_plane_left_btn { float:none; width:100%; } ul.m_two_plane_btns li.m_plane_right_btn { float:none; width:100%; margin-top:10px;} /* 横並び3列アンカーボタン */ ul.m_anchor_three_btns li { width:100%; margin:10px 0 0 0; float:none; } ul.m_anchor_three_btns li:first-child { margin-top:0; } ul.m_anchor_three_btns li a { width:1.5%; } /* 横並び2列黄アンカーボタン */ ul.m_two_etc_btn_anchor li { width:96%; margin-left:2%; float:none;} ul.m_two_etc_btn_anchor li a { width:1%; } /* 横並び多数ボタン */ ul.m_list_btns li { width:96%; margin-left:2%; float:none; } ul.m_list_btns li a { width:1%; } /* PDFボタン */ p.m_pdf_btns { width:100%; margin: 10px auto 0 !important; } p.m_pdf_btns a { width:1%; display:table-cell;} p.m_pdf_btns a img { vertical-align:middle;} /* PDFボタン (緑) */ p.m_pdf_btns02 { width:100%; } /* PDFボタン2つ横並び */ ul.m_pdf_btns li { width:100%; margin:10px 0 0 0; float:none; } ul.m_pdf_btns li:first-child { margin-top:0; } ul.m_pdf_btns li a img { vertical-align:middle; margin-right:3px; } /* PDFボタン3つ横並び */ ul.m_pdf_three_btns li { width:100%; margin:10px 0 0 0; float:none; } ul.m_pdf_three_btns li:first-child { margin-top:0; } ul.m_pdf_three_btns li a img { vertical-align:middle; margin-right:3px; } /* PDFリンク */ ul.m_pdf_list li { width:100%; float:none; } /* 横並び2列ボタン*/ ul.item2Area li { width:80%; margin:10px auto; display: block; } /* 横並び3列ボタン */ ul.item3Area li { float:none; margin:10px auto; width: 80%;} /* 流れ(フローチャート) 矢印テキスト横並び */ #main_area #m_contents_section .m_content_inner .m_flow_arrow_box { width:54.5%; /* margin-left:45%; */ } /* 改行 */ span.m_new_line_sp { display:block;} /* PDFテキストリンク*/ span.m_txt_pdf_link { margin:10px 0 0 0; display:block; } span.m_txt_pdf_link:first-child { margin-top:0;} span.m_txt_pdf_link a { color:#000000; background:url(../image/icon_pdf.gif) left center no-repeat; padding:0 0 1px 20px; } /* 横並べ */ ul.m_list_three li { width: 100%; float: none; } /* 流れ(フローチャート) */ #main_area #m_contents_section .m_content_inner .m_flow_chart_box li { background:url(../image/arrow07.gif) 50% top no-repeat; } #main_area #m_contents_section .m_content_inner .m_flow_chart_box li .m_flow_header_boxsection { float:none; width:100%;} #main_area #m_contents_section .m_content_inner .m_flow_chart_box li .m_flow_text_boxsection { float:none; width:100%; margin-top:10px; } /* 流れ(ステップ左右) */ #main_area #m_contents_section .m_content_inner .m_flow_step_box li { background:url(../image/arrow07.gif) 50% top no-repeat; } #main_area #m_contents_section .m_content_inner .m_flow_step_box li .m_flow_header_boxsection { float:none; width:100%;} #main_area #m_contents_section .m_content_inner .m_flow_step_box li .m_flow_text_boxsection { float:none; width:100%; margin-top:10px; } /* 流れ(ステップ上下) */ #main_area #m_contents_section .m_content_inner .m_flow_step_box02 { margin:20px 0 0; } #main_area #m_contents_section .m_content_inner .m_flow_step_box02 li { background:url(../image/arrow07.gif) 50% top no-repeat;} #main_area #m_contents_section .m_content_inner .m_flow_step_box02 li:first-child { margin:0 0 0; padding-top:0; background:none; } #main_area #m_contents_section .m_content_inner .m_flow_step_box02 li .m_flow_header_boxsection h3 { margin-top:0; background:none #7ca816; padding:8px 0; width:100%; float:none; } #main_area #m_contents_section .m_content_inner .m_flow_step_box02 li .m_flow_header_boxsection p { float:none; margin-left:0px; font-weight:bold; } /* 404 */ #main_area404 { width: 100%;} #main_area404 ul.m_two_plane_btns li.m_plane_right_btn.mb50 { margin-bottom:30px !important; } #main_area404 .search_404 { margin:0 auto; padding:5px; width:100%; box-sizing:border-box; } #main_area404 .search_404 ul.h_search_type { float:none; margin:5px 0 0 3px; width:99%; } #main_area404 .search_404 ul.h_search_type li { float:left; font-size:93%; margin-right:5px; } #main_area404 .search_404 .h_search_keyword_boxarea { margin:0 auto; float:none; width:99%; } #main_area404 .search_404 .h_search_keyword_boxarea .h_search_keyword_boxsection { margin:0 auto; } /*------------------------------ ポイントエリア -------------------------------*/ /* 3つのポイント*/ ul.pointArea3 li { float:none; width:70%; margin:4% auto 0; } ul.pointArea3 li:first-child, ul.pointArea3 li:first-child + li + li + li { margin:4% auto 0; } /* 4つのポイント*/ ul.pointArea4 li { float:none; width:100%; margin:4% 0 0 0; } ul.pointArea4 li:first-child { margin:4% 0 0 0; } /*------------------------------ 流れエリア -------------------------------*/ /* 4つのステップ*/ ul.flowArea4 li { float: left; width:49%; margin:2% 0 0 2%; } ul.flowArea4 li:first-child + li + li { margin-left:0; } /*------------------------------ 関連リンクエリア -------------------------------*/ ul.linkArea2 li { float: none; width:80%; margin:5% auto 0; } /*------------------------------ お申し込み 2個ボタン -------------------------------*/ ul.linkArea3 li { float: none; width:80%; margin:5% auto 0; } ul.linkArea3 li:first-child { margin:5% auto 0; } /*------------------------------ ナビボタン(3つ) -------------------------------*/ ul.naviList3 li {margin-left: 0; width: 100%; } /*------------------------------ 角丸バナー（赤） -------------------------------*/ ul.linkArea4 li { float: none; width:80%; margin:10px auto 0; } ul.linkArea4 li:first-child { margin-left:auto; } /*------------------------------ 角丸バナー（グレー） -------------------------------*/ ul.linkArea5 li { float: none; width:100%; margin:10px auto 0; } ul.linkArea5 li:first-child, ul.linkArea5 li:first-child + li + li + li { margin-left:auto; } /*------------------------------ グレー背景 -------------------------------*/ .bgGreyArea {padding:20px 10px;} /* 180806 add start */ /*------------------------------ チャットボット -------------------------------*/ #fixedWrap { position:fixed; left:10px; bottom:10px; z-index:100; } #procedureWrap { width: 75%; } #procedureWrap a#procedureBtn { width: 100%; } #procedureWrap a#procedureBtn img { width:100%; } #chatbotWrap { } #chatbotWrap a#chatbotBtn { width:76%; display:block; } #chatbotWrap a#chatbotBtn img { width:100%; } #chatbotWrap a#chatbotCloseBtn { position:absolute; left:70%; top:-20%; z-index:101; width:10%; } /* モーダル */ #modalWrap .modalSection button.closeModalBtn { width:10%; right:-2%; top:-2%; } #modalWrap .modalSection { width:95%; margin:10% auto; } #modalWrap .modalSection p#chatbotModalTtile { font-size:116%; } /* 180806 add end */ } @media screen and (max-width:480px){ /* リードスピーカー */ #readSpeakerArea { width: auto; margin: 0.2em 0 0 0.5em;} /* サイトロゴ */ #header #h_section #h_sitetitle_unit p#h_logo img { width:80%; } #header #h_section #h_navigation_unit p.h_search_office_atm { top:3px; right:8%; width:24%; } #header #h_section #gnavi p { top:3px; right:3px; width:8.1%; } table { word-break:break-all;} /* 内包3分割ボックス */ #main_area #m_contents_section .m_content_inner .m_w30per_in_box ul li { width:47%; } } @media screen and (max-width:730px){ /* お知らせ */ #info_area .i_contents_inner ul li { margin:0 0 5px; padding:0 0 5px; } #info_area .i_contents_inner ul li p.i_content_list_date { float:none; width:100%; margin:0 0 5px; line-height:1.4; } #info_area .i_contents_inner ul li p.i_content_list_date span { width:auto; margin:0; float:right; } #info_area .i_contents_inner ul li p.i_content_list_info { float:none; position:static; width:auto; } } @media screen and (max-width:640px){ /* write200525 */ #main_area #lnavi #ln_banking_section li.colTwo { width:100%; float:none; } #main_area #lnavi #ln_banking_section li.colTwo:nth-child(3) { float:none; } /* write200525 end */ /* write201203 start */ /*------------------------------ ほくぎんビジネスポータルログインバナー -------------------------------*/ #business_ib_login_area #business_ib_login_inner #business_ib_login_txt_box { padding:10px; } #business_ib_login_area #business_ib_login_inner #business_ib_login_txt_box h4 { line-height:1.3; } #business_ib_login_area #business_ib_login_inner #business_ib_login_txt_box p { margin-top:5px; line-height:1.3; } #business_ib_login_area #business_ib_login_inner #business_ib_login_hide_btn { width:35px; } #business_ib_login_area #business_ib_login_inner #business_ib_login_btn_box { padding:5px 10px; } /* write201203 end */ /* 210315追加 */ /*------------------------------ インターネットバンキング -------------------------------*/ #main_area #lnavi #m_side_banking_inner { background:#b94694; padding-bottom:10px; } /* write210326 */ .scrollBox { width:100%; overflow:scroll; } .scrollBox table { width:680px !important; } } @media screen and (max-width:980px){ #main_area #lnavi #m_side_banking_inner #m_side_banking_unit h4 img { margin:0; width:100%; } #main_area #lnavi #m_side_banking_inner #m_side_banking_unit h4 + p img { width:100%; } #main_area #lnavi #m_side_banking_inner #m_side_banking_unit h5 img { width:100%; } #main_area #lnavi #m_side_banking_inner #m_side_banking_unit .side_links01 li img { width:100%; } #main_area #lnavi #m_side_banking_inner #m_side_banking_unit .side_links02 li img { width:100%; } }