/*
======== table of content. ===============

summary:モバイル用ワイヤーフレーム要素

==========================================
*/

@media screen and (max-width: 800px) {
/*----------------------------------------
div#wrapper
------------------------------------------*/
#wrapper { min-width:100%; }

/*----------------------------------------
header
------------------------------------------*/
header { padding:15px 12px 10px; }
header h1 a { width:300px; height:44px; background:url(../images/atfive_new_logo_350.png) no-repeat 0 0; background-size:300px 44px; background-size: contain;}

/* globalnav
------------------------------------------*/
#globalnav li { display:table-cell; width:17%; height:44px; border:none; line-height:1; }
#globalnav li:last-child { width:auto; }
#globalnav li a { display:block; height:44px; padding:14px 10px; background:url(../images/bg_globalnav800.png) repeat-x center 0; background-size:88px 88px; }
#globalnav li a:hover { background-position:center -44px; }
#globalnav .current a { background-position:center -44px; }
#globalnav li a span { display:inline-block; width:60px; height:16px; background:url(../images/txt_globalnav800.png) no-repeat 0 0; background-size:410px 60px; }
#globalnav .gnav_profile a span { background-position:0 0; }
#globalnav .gnav_profile a:hover span,
#globalnav .gnav_profile.current a span { background-position:0 -40px; }
#globalnav .gnav_concept a span { background-position:-60px 0; }
#globalnav .gnav_concept a:hover span,
#globalnav .gnav_concept.current a span { background-position:-60px -40px; }
#globalnav .gnav_service a span { background-position:-120px 0; }
#globalnav .gnav_service a:hover span,
#globalnav .gnav_service.current a span { background-position:-120px -40px; }
#globalnav .gnav_recruit a span { width:72px; background-position:-180px 0; }
#globalnav .gnav_recruit a:hover span,
#globalnav .gnav_recruit.current a span { background-position:-180px -40px; }
#globalnav .gnav_partner a span { width:158px; background-position:-252px 0; }
#globalnav .gnav_partner a:hover span,
#globalnav .gnav_partner.current a span { background-position:-252px -40px; }

/*----------------------------------------
content
------------------------------------------*/
#content { padding:20px; }
#sec_main { float:none; width:100%; margin:0; padding:0; border:none; }

.btn_pagetop { }
.btn_pagetop a { padding:6px 0; }
.btn_pagetop a img { width:14px; height:9px; }

/*----------------------------------------
footer
------------------------------------------*/
.sec_footer_inner { width:100%; margin:0 auto; padding:13px 0; }
.sec_footer_links { float:none; }
.sec_footer_links .sec_footer_item { float:left; width:50%; min-height:246px; margin-right:0; }
.sec_footer_links .sec_footer_item:first-child { border-left:none; }
.sec_footer_links .sec_footer_item li { margin-top:5px; }
.sec_footer_links .sec_footer_item ul li:first-child { margin-top:0; }

.sec_footer_profile { flaot:none; position:relative; width:100%; margin-top:20px; padding:20px; border-top:1px solid #fce0a4; }
.sec_footer_profile .sec_policy { position:absolute; width:210px; height:82px; right:20px; top:20px; margin:0; padding:0; }
.txt_copyright { border-top:1px solid #f3b432; outline:1px solid #f0a405; background-color:#f0a405; }
.txt_copyright p { width:100%; margin:0 auto; padding:6px 20px; font-size:85.7%; text-align:right; }
#br-none{ display: none;}

/*----------------------------------------
commonitems
------------------------------------------*/
.box_balloon { width:200px; padding:15px 25px; }
.box_balloon:after { content:""; right:-8px; width:8px; height:12px; background-size:8px 12px; }
.box_balloon + .cell,
.box_balloon + dd { padding:20px 0 20px 30px; }
.sec_table_dotted.box_balloon + .cell,
.sec_table_dotted .box_balloon + dd { background:url(../images/bg_dotted_2x2.png) repeat 0 0; background-size:2px 2px; }

.box_gray { padding:15px 25px; }


}


@media screen and (max-width: 580px) {
/*----------------------------------------
div#wrapper
------------------------------------------*/
#wrapper { min-width:100%; }

/*----------------------------------------
header
------------------------------------------*/

/* suvnav
------------------------------------------*/
#suvnav { right:10px; top:10px; }
#suvnav a { display:inline-block; width:25px; height:25px; }
#suvnav .snav_access a { background:url(../images/bg_btn_subnav_access.png) no-repeat 0 0; background-size:25px 25px; }
#suvnav .snav_access a:hover { background-position:0 0; }
#suvnav .snav_contact a { width:25px; background:url(../images/bg_btn_subnav_contact.png) no-repeat 0 0; background-size:25px 25px; }
#suvnav .snav_contact a:hover { background-position:0 0; }

/* globalnav
------------------------------------------*/
#globalnav { }
/*#globalnav #trigger { display:block; padding:5px 20px; background: -webkit-linear-gradient(top,  rgba(240,240,240,1) 0%,rgba(234,234,234,1) 70%,rgba(214,214,214,1) 100%); background: linear-gradient(to bottom,  rgba(240,240,240,1) 0%,rgba(234,234,234,1) 70%,rgba(214,214,214,1) 100%); }
#globalnav #trigger.on { background: -webkit-linear-gradient(top,  rgba(240,240,240,1) 0%,rgba(221,213,229,1) 70%,rgba(205,190,221,1) 100%); background: linear-gradient(to bottom,  rgba(240,240,240,1) 0%,rgba(221,213,229,1) 70%,rgba(205,190,221,1) 100%); }*/

#globalnav ul { display:block; overflow:hidden; }
#globalnav li { display:block; float:left; width:50%; height:44px; border-top:1px solid #fff; }
#globalnav li:first-child,
#globalnav ul li:nth-child(2) { border-top:none; }
#globalnav li:last-child { clear:both; width:100%; }
#globalnav ul li:nth-child(2n+1) a { border-left:none; }
#globalnav ul li:nth-child(2n) a { border-right:none; }
#globalnav ul li:last-child a { border-left:none; border-right:none; }


/*----------------------------------------
content
------------------------------------------*/
#content { padding:20px 10px; }
#sec_main h1 { margin:20px 0; padding-bottom:10px;font-size:142.8%; }
#sec_main h1 span { margin-left:10px; font-size:50%; }
#sec_main h2 { margin:20px 0; color:#601986; font-size:114.2%; }
#sec_main .txt_intro { position:relative; margin:20px 0; padding:10px 0; font-size:128.5%; text-align:center; }
#sec_main h1 + .txt_intro { margin-top:-20px; }
#sec_main .txt_intro span { margin-left:0; }

table td { font-size:85.7%; }

/*----------------------------------------
footer
------------------------------------------*/
.sec_footer_inner { width:100%; margin:0 auto; padding:0 0 10px; }
.sec_footer_links { float:none; }
.sec_footer_links .sec_footer_item { float:none; width:100%; min-height:100%; margin:0; border:none; }
.sec_footer_links .sec_footer_item:last-child { border:none; border-top:1px solid #fce0a4; }

.sec_footer_links .sec_footer_item h3 { padding-bottom:4px; border-bottom:none; }
.sec_footer_links .sec_footer_item h3:after { content:""; display:inline-block; width:14px; height:10px; margin-left:4px; background:url(../images/icon_accordion_trigger.png) no-repeat 0 0; background-size:14px 30px; vertical-align:middle; }
.sec_footer_links .sec_footer_item h3.on:after { background-position:0 -20px; }
.sec_footer_links .sec_footer_item h3 img { width:auto; height:12px; }
.sec_footer_links .sec_footer_item ul { display:none; margin-top:0; padding-top:10px; border-top:1px solid #fcdb98; }

.sec_footer_profile { margin-top:0; padding:20px; border-top:1px solid #fce0a4; }
.sec_footer_profile .sec_policy { position:relative; width:100%; height:82px; right:auto; top:auto; margin:0; }
.txt_copyright { border-top:1px solid #f3b432; outline:1px solid #f0a405; background-color:#f0a405; }
.txt_copyright p { width:100%; margin:0 auto; padding:6px 20px; font-size:85.7%; text-align:right; }
.sec_footer_profile .txt_policy { float:left; margin-top:0; padding-top:62px; font-size:85.7%; }
#br-none{ display: none;}


/*----------------------------------------
commonitems
------------------------------------------*/
.sec_table_balloon .sec_table,
.sec_table_balloon .sec_table dt,
.sec_table_balloon .sec_table dd { display:block; }
.sec_table_balloon { margin-top:10px; }
.box_balloon { width:100%; padding:10px 12px; text-align:center; }
.box_balloon:after { content:""; left:0; right:0; top:auto; bottom:-9px; width:100%; height:9px; background:url(../images/bg_balloon_after_sp.png) no-repeat 28px top; background-size:9px 6px; }
.box_balloon + .cell,
.box_balloon + dd { padding:10px 0; }

.box_gray { padding:10px 12px; }

}