﻿@charset "utf-8";

/*
 *
 * Usage: TOP page layout
 *
 * Name: top.css
 *
 */


/*---------------------------------------------------------------------
Header layout
---------------------------------------------------------------------*/
#topHeader  {width:100%; background:#fcf9ed; padding-bottom:30px;}
	
	.notAndroid #udonSlider  {position:relative; margin-bottom:24px; overflow:hidden; height:524px; z-index:1;}
		.notAndroid #udonInner  {overflow:hidden;}
			.notAndroid #udonPhoto  {width:3500px;}
				.notAndroid #udonPhoto li  {float:left; margin:0 5px; _margin:0 4px;}

		#udonThumb  {background:url(../images/top/bg_thumb-list.png) repeat 0 0; text-align:center; width:100%; position:absolute; bottom:0; left:0; padding:4px 0;}
			#udonThumb li   {display:inline-block; *display:inline; *zoom:1; vertical-align:bottom; border:1px solid #fff;}
            #udonThumb .thumb01  {background:url(../images/top/thumb_slide01_on.jpg) no-repeat 0 0;}
            #udonThumb .thumb02  {background:url(../images/top/thumb_slide02_on.jpg) no-repeat 0 0;}
            #udonThumb .thumb03  {background:url(../images/top/thumb_slide03_on.jpg) no-repeat 0 0;}
            #udonThumb .thumb04  {background:url(../images/top/thumb_slide04_on.jpg) no-repeat 0 0;}
            #udonThumb .thumb05  {background:url(../images/top/thumb_slide05_on.jpg) no-repeat 0 0;}
            #udonThumb .thumb06  {background:url(../images/top/thumb_slide06_on.jpg) no-repeat 0 0;}
            #udonThumb .thumb07  {background:url(../images/top/thumb_slide07_on.jpg) no-repeat 0 0;}
            #udonThumb .thumb08  {background:url(../images/top/thumb_slide08_on.jpg) no-repeat 0 0;}
            #udonThumb .thumb09  {background:url(../images/top/thumb_slide09_on.jpg) no-repeat 0 0;}
            #udonThumb .thumb10  {background:url(../images/top/thumb_slide10_on.jpg) no-repeat 0 0;}
            #udonThumb .thumb11  {background:url(../images/top/thumb_honey_on.jpg) no-repeat 0 0;}

            #udonThumb a.active  {opacity:0;}
		
		#pagenate {background:#f0f; width:100px; height:20px;}
    
    #udonLoader  {background:url(../images/top/img_loader.gif) no-repeat 50% 50% #fcf9ed; width:100%; height:545px; position:absolute; top:0; left:0; z-index:98; display:none;}
    
    
    .slide_container  {width:100%;}
        .slide_box    {position:relative;}
        .slide_box li  {float:left;}
    

	#hgroup  {clear:both; width:913px; margin:0 auto; position:relative;}
		#hgroup #logo,
		#hgroup #copy,
		#hgroup #topGnav  {float:right;}
		
		#hgroup #logo  {margin:10px 0 0 52px;}
		#hgroup #copy  {margin:16px 0 0 21px; width:140px;}
        
        #hgroup #copy #btnConcept  {float:left; width:20px; margin-right:12px;}
		
		#hgroup #topGnav li  {float:right;}
        #hgroup #topGnav a   {display:block; overflow:hidden; height:0; padding-top:234px;}
        
		#hgroup #topGnav .tgnav01  {background:url(../images/top/gnav01_on.gif) no-repeat 0 0;}
		#hgroup #topGnav .tgnav02  {background:url(../images/top/gnav02_on.gif) no-repeat 0 0;}
		#hgroup #topGnav .tgnav03  {background:url(../images/top/gnav03_on.gif) no-repeat 0 0;}
		#hgroup #topGnav .tgnav04  {background:url(../images/top/gnav04_on.gif) no-repeat 0 0;}
		#hgroup #topGnav .tgnav05  {background:url(../images/top/gnav05_on.gif) no-repeat 0 0;}
        
        #hgroup #topGnav .tgnav01 a  {background:url(../images/top/gnav01.gif) no-repeat 0 0;}
		#hgroup #topGnav .tgnav02 a  {background:url(../images/top/gnav02.gif) no-repeat 0 0;}
		#hgroup #topGnav .tgnav03 a  {background:url(../images/top/gnav03.gif) no-repeat 0 0;}
		#hgroup #topGnav .tgnav04 a  {background:url(../images/top/gnav04.gif) no-repeat 0 0;}
		#hgroup #topGnav .tgnav05 a  {background:url(../images/top/gnav05.gif) no-repeat 0 0;}

		#hgroup #imgUdon  {position:absolute; top:-35px; left:-14px; z-index:99;}



/*---------------------------------------------------------------------
topWrapper layout
---------------------------------------------------------------------*/



#topWrapper  {width:100%; background:#f7f4e8; border-top:1px solid #dfdacd; padding:55px 0 18px 0;}
/*
#topWrapper  {width:100%; background:#f7f4e8; border-top:1px solid #dfdacd; padding:20px 0 18px 0;}
*/
/*
↑キャンペーン切り替え（期間外）
#topWrapper  {width:100%; background:#f7f4e8; border-top:1px solid #dfdacd; padding:0 0 18px 0;}
or
↑キャンペーン切り替え（期間中）
*/
	#topContainer  {width:980px; margin:0 auto;}
	
		/* leftBox */
		#leftBox  {float:left; width:505px;}
/*			#udonConnection  {margin:0 40px 44px 37px;}*/
			#udonConnection  {margin:0 40px 24px 37px;}
/*
				#udonConnection  h2,
				#udonstagram,
				#shareFollowList  {float:right;}*/
/*				
				#udonConnection  h2  {margin-left:35px;}*/
				#udonConnection  h2  {text-align: center;}
				
                #udonstagram  {margin-left:22px; width:197px;}
                    #udonstagram h3      {margin-bottom:13px;}
                    #udonstagram .nav    {text-align:center;}
                    #udonstagram .nav a  {border-radius:2px; background:#dfdacd; display:block; padding:10px 0; font-size:0;}
                    #udonstagram .nav img  {vertical-align:top;}
                    
                    
                    #udonstagramWrap     {overflow:hidden; height:197px; margin:12px 0; background:url(../images/top/img_loader.gif) no-repeat 50% 50%;}
                        #udonstagram #udonstagramPhoto  {}
                            #udonstagram #udonstagramPhoto img  {height:197px;}
				
/*				#shareFollowList  {margin-top:-8px;}*/
				#shareFollowList  {margin-top:20px; display:flex;flex-wrap: wrap;}
					#shareFollowList li  {margin-bottom:13px;}
					#shareFollowList li:nth-of-type(even)  {margin-left:13px;}
			
			
/*			#udonKodawari  {margin-left:20px;}*/
			#udonKodawari  {margin-left:20px; margin-top:30px;}
			
			
		
		
		/* rightBox */
		#rightBox  {float:right; width:417px;}
			#udonNews  {margin-bottom:30px; padding-right:52px;}
				#udonNews h2  {float:right;}
				#udonNews #newsList  {float:left; width:310px; border-top:1px solid #dfdacd;}
					#udonNews #newsList li       {background:url(../images/common/line_dot-x2.gif) repeat-x 0 100%;}
					#udonNews #newsList li.last  {background:none;}
					#udonNews #newsList a        {display:block; padding:10px;}
					#udonNews #newsList p        {display:block; padding:10px;}
					#udonNews #newsList span     {display:block;}
					#udonNews #newsList .date    {width:75px; line-height:100%;}
					#udonNews #newsList .txt     {margin:-14px 0 0 78px; line-height:120%;}
					
				#udonNews #btnArchives  {text-align:center; border-bottom:1px solid #dfdacd; border-top:1px solid #dfdacd;}


			#udonPR  {margin-bottom:70px; position:relative;}
                #udonPRPhoto  {position:relative; float:left; height:362px;}
                    #udonPRPhoto li  {position:absolute; top:0; left:0;}
                
                #udonPRThumb  {position:absolute; right:15px; bottom:0;}
                    #udonPRThumb li  {margin-top:12px;}
                    #udonPRThumb a   {border:1px solid #dfdacd; display:block;}
                    #udonPRThumb a:hover,
                    #udonPRThumb a.active  {border-color:#423f3b;}
                    #udonPRThumb a.active img  {opacity:0.7; filter:alpha(opacity=70);}


/*---------------------------------------------------------------------
assistance layout
---------------------------------------------------------------------*/
#assistance  {border-top:1px solid #dfdacd; background:#fcf9ed; padding:18px 0; text-align:center;}



/*---------------------------------------------------------------------
concept layout
---------------------------------------------------------------------*/
#overlay  {position:fixed; top:0; left:0; width:100%; height:100%; background:url(../images/colorbox/overlay.png) repeat 0 0; z-index:99999; display:none; cursor:pointer;}
#overConcept  {position:fixed; top:50%; left:50%; width:730px; height:480px; margin:-240px 0 0 -365px; text-align:center; display:none;
               background:url(../images/top/bg_concept.png) repeat 0 0; z-index:100000; border:1px solid #dfdacd;}

    #btnConceptClose  {position:absolute; top:15px; right:15px;}
    #txtConcept       {padding:80px 0 60px 0;}




/*---------------------------------------------------------------------
Android layout
---------------------------------------------------------------------*/
.android  {}
    .android #udonSlider  {position:relative; margin-bottom:24px; height:524px; width:1040px; margin:0 auto; z-index:1;}
		.android #udonInner  {}
			.android #udonPhoto  {position:relative; width:100%;}
				.android #udonPhoto li  {float:none; position:absolute; top:0; left:0; margin:0;}

/*---------------------------------------------------------------------
採用情報バナー（2つ並び）
---------------------------------------------------------------------*/

.bnrEmployment {
	width:888px;
}

