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

#gifu .nav-studio a {
  color: #b4d100!important;
}
#kani .nav-studio a {
  color: #ef7a1b!important;
}
#gifu .page-tit .page-bg {
  background: url("../images/gifu/studio-images/gage-tit.jpg") 50% 0 no-repeat;
}
#kani .page-tit .page-bg {
  background: url("../images/kani/studio-images/gage-tit.jpg") 50% 0 no-repeat;
}

/* ==========================================================================
	CONTENTS
	========================================================================== */

#topic-path {
  margin-bottom: 0!important;
}
.page-tit {
	margin-bottom: 0;
}

/*ABOUT*/

.about {
  color: rgba(255,255,255,0.8);
}
#gifu .about {
  background: url("../images/gifu/studio-images/bg.jpg") 50% 100% no-repeat;
  background-color: #000;
  padding: 80px 0 800px 0;
}
#kani .about {
  background-color: #000;
  padding: 80px 0;
}
.about a,.about a:visited {
  color: rgba(255,255,255,0.8);
}

.about dl {
  overflow: hidden;
  border-bottom: solid 1px rgba(255,255,255,0.3);
  padding: 25px;
}
.about dl dt {
  float: left;
  width: 20%;
}
.about dl dd {
  float: right;
  width: 75%;
}

/*FLOW*/

.flow dl {
  overflow: hidden;
}
.flow dl dt {
  float: left;
  width: 20%;
  color: rgba(255,255,255,0.8);
  background-color: #000;
	text-align: center;
	font-size: 1.6rem;
  padding: 20px 0;
}
.flow dl dd {
  float: right;
  width: 80%;
  border-left: solid 1px #000;
  padding: 20px 0 40px 40px;
}
.flow dl dd h3 {
  margin-bottom: 40px;
}
.flow dl dd h4 {
  font-size: 1.7rem;
  margin-bottom: 20px;
}
.flow dl dd th {
  font-weight: normal;
  text-align: center;
  border: solid 1px #ccc;
  padding: 10px;
}
.flow dl dd td {
  border: solid 1px #ccc;
  padding: 10px;
}
.flow .img {
	overflow: hidden;
}
.flow .img li {
  float: left;
  width: 50%;
}

/* ==========================================================================
	PC 1025px -
	========================================================================== */

@media screen and (min-width: 1025px){


}


/* ==========================================================================
	TABLET - 1024px
	========================================================================== */

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

.about {
	background-size: 1500px;
  padding: 60px 0 600px 0;
}

/*FLOW*/

.flow dl dt {
	font-size: 1.4rem;
}
.flow dl dd {
  padding: 20px 0 30px 30px;
}
.flow dl dd h3 {
  margin-bottom: 30px;
}
.flow dl dd h4 {
  font-size: 1.5rem;
}

}

/* ==========================================================================
	SP - 640px
	========================================================================== */

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

/*ABOUT*/

.about {
	background-size: 1000px;
  padding: 40px 0 400px 0;
}
.about dl {
  padding: 15px;
}
.about dl dt {
  float: none;
  width: 100%;
	font-weight: bold;
	margin-bottom: 5px;
}
.about dl dd {
  float: none;
  width: 100%;
}

/*FLOW*/

.flow dl dt {
  float: none;
  width: 100%;
	font-size: 1.3rem;
  padding: 10px 0;
}
.flow dl dd {
  float: none;
  width: 100%;
  padding: 25px 0 30px 15px;
}
.flow dl dd h3 {
  margin-bottom: 20px;
}
.flow dl dd h4 {
  font-size: 1.4rem;
  margin-bottom: 15px;
}
.flow dl dd table {
	border-bottom: solid 1px #ccc;
}
.flow dl dd th {
	display: block;
	width: 100%;
	border-bottom: none;
  padding: 7px;
}
.flow dl dd td {
	display: block;
	width: 100%;
	border-bottom: none;
  padding: 7px;
}

.flow .img li {
	float: none;
	width: 100%;
	border-bottom: none;
  padding: 7px;
}

}