@charset "UTF-8";
/* CSS Document */



/*-----------
business
-----------*/

#wrapper_business{
  position: relative;
  padding-top: 112px;
  background: #f3f2e7;
}

#business{
  padding-bottom: 80px;
  text-align: center;
}

#business.contents h1{
  padding: 80px 0 60px;
}

#business.contents h1 img{
  height: 44px;
}

#business.contents h1.title_business{
  width: 503px;
  height: 44px;
  margin: 0 auto;
  background: url("../img/title_business.png") no-repeat left 80px;
  background-size: 503px auto;
}

#business.contents h1.title_business img{
  display: none;
}

.read{
  font-size: 18px;
  padding-bottom: 70px;
}

.business_contents{
  width: 100%;
  border-top: 1px solid #aaa9a1;
  padding: 70px 0 80px;
}

h2{
  font-size: 34px;
  margin-bottom: 40px;
  line-height: 1.4;
  padding: 12px 0;
}

#line h2{
  font-size: 34px;
  margin-bottom: 40px;
  display: inline-block;
  background: url("../img/line_logo.png") no-repeat left top;
  background-size: auto 60px;
  padding-left: 80px;
}

.business_contents > p{
  font-size: 18px;
  margin-bottom: 40px;
}

.business_contents > p.link_pdf{
  margin: 40px 0 0;
}

.business_contents > p.link_pdf a{
  text-decoration: underline;
}

.btn_business{
  width: 440px;
}

#howto-exchange ul{
  display:flex;
  flex-wrap:wrap;
}

#howto-exchange ul li{
  width: 24%;
  margin: 0 1.333% 0 0;
}

#howto-exchange ul li:nth-child(4n){
  margin: 0;
}

#howto-exchange ul li a{
  display: block;
  width: 100%;
  border: 1px solid #d1d1d1;
  padding: 9px;
  box-sizing: border-box;
  background: #ffffff;
}

#howto-exchange ul li a .grade {
  width: 100%;
  height: 24px;
  line-height: 24px;
  color: #fff;
  text-align: center;
}

.grade.premium {
  background: rgb(190,176,128);
  background: linear-gradient(90deg, rgba(190,176,128,1) 0%, rgba(212,199,152,1) 50%, rgba(190,176,128,1) 100%);
}
.grade.highgrade {
  background: #0076a5;
}
.grade.light {
  background: #61bbc4;
}

#howto-exchange ul li a div {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  width: 212px;
  height: 104px;
  background: url("../../common/img/arrow_r_bk.png") no-repeat center right;
  background-size: 8px auto;
  padding-right: 10px;
}

#howto-exchange ul li a div img {
  width: 90px;
  height: auto;
}

#howto-exchange ul li a div p {
  width: 122px;
  font-size: 17px;
  font-weight: bold;
  color: #000;
}

#back{
  width: 440px;
  border-top: 1px solid #aaa9a1;
  padding: 100px 280px 30px;
}



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


#wrapper_business{
  width: 100%;
  padding-top: 50px;
  font-size: 15px;
}

#business{
  padding-bottom: 50px;
}

#business.contents h1{
  padding: 40px 0 25px;
}

#business.contents h1 img{
  height: 30px;
}

#business.contents h1.title_business{
  width: 191.6px;
  height: 66.14px;
  margin: 0 auto;
  background: none;
}

#business.contents h1.title_business img{
  display: block;
  height: 66.14px;
}

.read{
  font-size: 16px;
  padding-bottom: 30px;
}

.business_contents{
  padding: 30px 0 40px;
}

h2{
  font-size: 25px;
  margin-bottom: 20px;
  padding: 8px 0;
}

#line.business_contents h2{
  font-size: 25px;
  line-height: 30px;
  margin-bottom: 20px;
  background: url("../img/line_logo.png") no-repeat left center;
  background-size: auto 50px;
  padding-left: 60px;
}

.business_contents > p{
  font-size: 16px;
  margin-bottom: 20px;
}

.business_contents > p.link_pdf{
  margin: 20px 0 0;
}


.btn_business{
  width: 100%;
}

#howto-exchange ul{
  display: block;
}

#howto-exchange ul li{
  width: 100%;
  margin: 0 0 10px;
}

#howto-exchange ul li:nth-child(4n){
  width: 100%;
  margin: 0;
}

#howto-exchange ul li a{
  padding: 9px 9px 3px;
}

#howto-exchange ul li a .grade {
  height: 22px;
  line-height: 22px;
}

#howto-exchange ul li a div {
  width: 100%;
  height: 92.63px;
  box-sizing: border-box;
  background: url(../../common/img/arrow_r_bk.png) no-repeat center right 5px;
  background-size: 10px auto;
  padding-right: 20px;
}

#howto-exchange ul li a div img {
  width: 80px;
  height: 92.63px;
  padding: 0 10px;
}

#howto-exchange ul li a div p {
  width: calc(100% - 100px);
  font-size: 20px;
}

#back {
  width: 100%;
  padding: 50px 0 0;
}

}