@charset "utf-8";

@media only screen and (max-width: 640px) {

/*============================
#mainPanelArea
============================*/
#mainPanelArea { min-width: inherit; height: 280px; position: relative; margin-top: 0; overflow: hidden; border-bottom: solid 5px #4b1f1a; }
#mainPanelArea .pad {}
#mainPanelArea .pad ul {}
#mainPanelArea .pad ul li { min-width: inherit; height: 280px; text-indent: -9999px; position: relative; }
#mainPanelArea .pad ul li.panel01 { background: url(../../imageFile/top/panel_01_sp.png) no-repeat center; background-size: cover; }
#mainPanelArea .pad ul li.panel02 { background: url(../../imageFile/top/panel_02_sp.png) no-repeat center; background-size: cover; }
#mainPanelArea .pad ul li.panel03 { background: url(../../imageFile/top/panel_03_sp.png) no-repeat center; background-size: cover; }
#mainPanelArea .pad ul li.panel04 { background: url(../../imageFile/top/panel_04_sp.png) no-repeat center; background-size: cover; }
#mainPanelArea .pad ul li::after { position: absolute; left: 0; top: 0; width: 100%; height: 20px; background: url(../../imageFile/top/bg_panel.png) repeat-x left top; background-size: auto 20px; }
#mainPanelArea .pad ul li::before { position: absolute; content: ""; display: block; left: inherit; right: -20px; top: 5px; margin-left: 0; width: 260px; height: 260px; background: url(../../imageFile/top/bg_panelText.png) no-repeat left top; background-size: 280px auto;}
#mainPanelArea .number { position: absolute; left: 20px; top: 220px; margin-left: 0; width: 80px; height: 25px; background: url(../../imageFile/top/image_since.png) repeat-x left top; background-size: 80px auto; }
#mainPanelArea .bx-wrapper .bx-pager { position: absolute; bottom: 10px; }
#mainPanelArea .bx-wrapper .bx-pager.bx-default-pager a { background: rgba(255,255,255,.5); text-indent: -9999px; display: block; width: 30px; height: 3px; margin: 0 5px; outline: 0; border-radius: 0; }
#mainPanelArea .bx-wrapper .bx-pager.bx-default-pager a:hover,
#mainPanelArea .bx-wrapper .bx-pager.bx-default-pager a.active { background: rgba(0,0,0,.5); }
#mainPanelArea .bx-wrapper .bx-controls-direction {}
#mainPanelArea .bx-wrapper .bx-controls-direction a {}

/*============================
#recruitArea
============================*/
#recruitArea { width: 100%; margin-top: 0; }
#recruitArea .pad {}
#recruitArea .pad .content { font-size: 0.875em; }
#recruitArea .pad .content:hover {}
#recruitArea .pad .content:before, .content:after {}
#recruitArea .pad .content:before {} 
#recruitArea .pad .content:after {} 
#recruitArea .pad .content a { padding: 30px; line-height: 1.5; }
#recruitArea .pad .content a br { display: block }
#recruitArea .pad .content a span { display: inline-block; margin: 6px 0 0; }    
    
/*============================
#newsArea
============================*/
#newsArea { width: inherit; margin-top: 30px; }
#newsArea .pad { width: inherit; margin: 0 20px; position: relative; padding-bottom: 50px; }
#newsArea .pad .title {}
#newsArea .pad .title img { width: auto; height: 35px; }
#newsArea .pad .linkAll { position: absolute; right: 0; top: inherit; bottom: 0; }
#newsArea .pad .linkAll a { display: inline-block; background: #a04e4a; color: #fff; padding: 8px 12px; width: inherit; border-radius: 40px; font-size: 0.75em; text-align: center; }
#newsArea .pad .recommendList { margin-top: 15px; }
#newsArea .pad .recommendList ul li { width: inherit; float: inherit; margin-top: -1px; margin-left: -20px; margin-right: -20px; }
#newsArea .pad .recommendList ul li:nth-child(2n) { margin-left: -20px; }
#newsArea .pad .recommendList ul li a { padding: 15px 30px 15px 60px; background: #fbfbf9 url(../../imageFile/top/icon_cup.png) no-repeat 10px center; background-size: 40px auto; border-left: none; border-right: none;  }
#newsArea .pad .recommendList ul li.new a { background: #fbfbf9 url(../../imageFile/top/icon_cup_new.png) no-repeat 10px center; background-size: 40px auto; }
#newsArea .pad .recommendList ul li a::after {}
#newsArea .pad .recommendList ul li a .date { margin-right: 5px; font-size: 0.75em; }
#newsArea .pad .recommendList ul li a .kategoriTag { width: inherit; margin-right: 0; padding: 4px 20px; font-size: 0.75em; }
#newsArea .pad .recommendList ul li a .newsText { margin-top: 6px; padding: 0; font-size: 0.875em; }
#newsArea .pad .normalList {}
#newsArea .pad .normalList ul li { width: inherit; float: inherit; margin-top: -1px; margin-left: -20px; margin-right: -20px; }
#newsArea .pad .normalList ul li:nth-child(2n) { margin-left: -20px; }
#newsArea .pad .normalList ul li a { padding: 15px 30px 15px 60px; background: #fbfbf9 url(../../imageFile/top/icon_cup.png) no-repeat 10px center; background-size: 40px auto; border-left: none; border-right: none; }
#newsArea .pad .normalList ul li.new a { background: #fbfbf9 url(../../imageFile/top/icon_cup_new.png) no-repeat 10px center; background-size: 40px auto; }
#newsArea .pad .normalList ul li a:hover {}
#newsArea .pad .normalList ul li a::after {}
#newsArea .pad .normalList ul li a .date { margin-right: 5px; font-size: 0.75em; }
#newsArea .pad .normalList ul li a .kategoriTag { width: inherit; margin-right: 0; padding: 4px 20px; font-size: 0.75em; }
#newsArea .pad .normalList ul li a .newsText { margin-top: 6px; padding: 0; font-size: 0.875em; }

/*============================
#topicsArea
============================*/
#topicsArea { width: inherit; margin-top: 30px; }
#topicsArea .pad { width: inherit; margin: 0 20px; position: relative; padding-bottom: 40px; }
#topicsArea .pad .title {}
#topicsArea .pad .title img { width: auto; height: 35px; }
#topicsArea .pad .linkAll { position: absolute; right: 0; top: inherit; bottom: 0; }
#topicsArea .pad .linkAll a { display: inline-block; background: #a04e4a; color: #fff; padding: 8px 12px; width: inherit; border-radius: 40px; font-size: 0.75em; text-align: center; }
#topicsArea .pad .topicsList { margin-top: 20px; }
#topicsArea .pad .topicsList ul {}
#topicsArea .pad .topicsList ul li { width: inherit; padding: 0 15px; }
#topicsArea .pad .topicsList ul li a {}
#topicsArea .pad .topicsList ul li a .image {}
#topicsArea .pad .topicsList ul li a .image img {}
#topicsArea .pad .topicsList ul li a .info { margin-top: 10px; }
#topicsArea .pad .topicsList ul li a .info .tenpoTag { font-size: 0.75em; }
#topicsArea .pad .topicsList ul li a .info .date { font-size: 0.75em; }
#topicsArea .pad .topicsList ul li a .topicsText { font-size: 0.875em; margin-top: 5px; }

.bx-wrapper .bx-prev { left: -15px!important; background: url(../../imageFile/global/icon_arrow_gr_return.svg) no-repeat center!important; background-size: 20px auto!important; }
.bx-wrapper .bx-next { right: -15px!important; background: url(../../imageFile/global/icon_arrow_gr.svg) no-repeat center!important; background-size: 20px auto!important; }

/*============================
#bannerArea
============================*/
#bannerArea { margin-top: 20px; min-width: inherit; margin-bottom: -40px; }
#bannerArea .pad { width: inherit; margin: 0 auto; padding: 10px 0 20px; }
#bannerArea .pad ul { width: inherit; margin: 0 20px; }
#bannerArea .pad ul li { width: 49%; margin-right: 2%; margin-top: 10px; }
#bannerArea .pad ul li:nth-child(3n) { margin-right: 2%; }
#bannerArea .pad ul li:nth-child(2n) { margin-right: 0; }
#bannerArea .pad ul li a img { width: 100%; height: inherit; }

}