@charset "utf-8";
@import url(cmn.css);
@import url(base.css);

/* ==========================================================================
	CONTENT
========================================================================== */

#cosmetics h2{ border-bottom:1px solid #83c4c7; }
#studio h2{ border-bottom:1px solid #e88c87; }
#order h2{ border-bottom:1px solid #eba749; }
#oem h2{ border-bottom:1px solid #cccc66; }
#academy h2{ border-bottom:1px solid #92c274; }
#foreign h2{ border-bottom:1px solid #a48d84; }
#franchise h2{ border-bottom:1px solid #379fd1; }
#communication h2{ border-bottom:1px solid #8c75a6; }
#online h2{ border-bottom:1px solid #f69c62; }

/* ------------------------------------------------------------
	 PC   800px -
------------------------------------------------------------ */

@media screen and (min-width: 800px) {
#head{
  border-bottom:1px solid #c6c6c6;
}
/*lead*/
#lead .float-l{
  /*width:285px;
  margin-left:45px;*/
  padding-top:137px;
	width:375px;
}
#lead .float-r{
  /*width:441px;
  margin-right:85px;*/
	width:55%;
}
#lead .float-l img,#lead .float-r img{
  width:100%;
  height: auto;
}

/*development*/
#development h2{
  padding-bottom:5px;
  border-bottom:1px solid #533c34;
  margin-bottom:20px;
}
#development h2 img{
  height:26px;
}
#development .float-r{
  width:345px;
}
#development .float-l{
  width:585px;
}

#cosmetics h2,#studio h2,#order h2 {
  padding-bottom:5px;
  /*border-bottom:1px solid #a1611a;*/
  margin-bottom:20px;
}
#cosmetics h2 img,#studio h2 img,#order h2 img {
  height:26px;
}
#cosmetics .float-r,#studio .float-r,#order .float-r{
  width:345px;
}
#cosmetics .float-l,#studio .float-l,#order .float-l{
  width:585px;
}

#oem,#foreign,#communication{
  width:465px;
  float:left;
}
#academy,#franchise{
  width:465px;
  float:right;
}
.business-box h2{
  padding-bottom:5px;
  margin-bottom:20px;
}
.business-box h2 img{
  height:26px;
}
.business-box .float-r{
  width:212px;
}
.business-box .float-r img{
  width:100%;
  height:auto;
}
.business-box .float-l{
  width:235px;
}
#academy,#online{
  width:465px;
  float:right;
  float:right;
}
    
}

/* ------------------------------------------------------------
	 TABLET   for - 799px
------------------------------------------------------------ */

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

/*lead*/
#lead .float-l{
  width:40%;
  padding-top:40px;
  margin-left:5%;
}
#lead .float-r{
  width:40%;
  margin-right:5%;
}
#lead .float-l img,#lead .float-r img{
  width:100%;
  height: auto;
}
/*development*/
#development h2{
  padding-bottom:5px;
  border-bottom:1px solid #533c34;
  margin-bottom:20px;
}
#development h2 img{
  height:26px;
}
#development .float-r{
  width:35%;
}
#development .float-l{
  width:60%;
}
/*studio*/
#cosmetics h2,#studio h2,#order h2{
  padding-bottom:5px;
  border-bottom:1px solid #a1611a;
  margin-bottom:20px;
}
#cosmetics h2 img,#studio h2 img,#order h2 img{
  height:26px;
}
#cosmetics .float-r,#studio .float-r,#order .float-r{
  width:35%;
}
#cosmetics .float-l,#studio .float-l,#order .float-l{
  width:60%;
}

#oem,#foreign,#communication{
  width:48%;
  float:left;
}
#academy,#franchise{
  width:48%;
  float:right;
}
.business-box h2{
  padding-bottom:5px;
  margin-bottom:20px;
}
.business-box h2 img{
  height:26px;
}
.business-box .float-r{
  width:48%;
}
.business-box .float-r img{
  width:100%;
  height:auto;
}
.business-box .float-l{
  width:48%;
}
#academy,#online{
  width:48%;
  float:right;
}

}
/* ------------------------------------------------------------
	 SP　599pxまで
------------------------------------------------------------ */

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

/*lead*/
#lead .float-l{
  float:none;
  width:100%;
  text-align:center;
  padding-top:0;
  margin-left:0;
}
#lead .float-r{
  float:none;
  width:100%;
  text-align:center;
  margin-right:0;
}
#lead .float-l img,#lead .float-r img{
  width:100%;
  height:auto;
}
#lead .float-l img{
  margin-bottom:20px;
}
/*development*/
#development h2{
  padding-bottom:5px;
  margin-bottom:10px;
}
#development h2 img{
  height:20px;
}
#development .float-r{
  width:100%;
}
#development .float-l{
  width:100%;
}
	
/*studio*/
#cosmetics h2,#studio h2,#order h2{
  padding-bottom:5px;
  margin-bottom:10px;
}
#cosmetics h2 img,#studio h2 img,#order h2 img{
  height:20px;
}
#cosmetics .float-r,#studio .float-r,#order .float-r{
  width:100%;
}
#cosmetics .float-l,#studio .float-l,#order .float-l{
  width:100%;
}

#oem,#foreign,#communication{
  width:100%;
  float:none;
}
#academy,#franchise{
  width:100%;
  float:none;
}
.business-box h2{
  padding-bottom:5px;
  margin-bottom:20px;
}
.business-box h2 img{
  height:20px;
}
.business-box .float-r{
  float:none;
  width:100%;
  text-align:center;
}
.business-box .float-r img{
  width:70%;
  height:auto;
}
.business-box .float-l{
  float:none;
  width:100%;
}
#academy,#online{
  width:100%;
  float:none;
}

}