@charset "UTF-8";
@media screen and (min-width: 768px),print {
.main-title{background: url(../images/orthodontics/h1.jpg)no-repeat top center; background-size: cover;}

#contentsmain {margin: 0 auto 100px;position: relative;text-align: center;padding: 0 2.6rem;}
#contentsmain .inner-Box {margin: 0 auto;padding: 28px 0 0;position: relative;}
#contentsmain .icon{margin-bottom: -7px;display: block;position: relative;z-index: 3;}
#contentsmain .inner-Box h2 {font-size: 2rem;line-height: 1;font-weight: 700;letter-spacing: 0.4rem;margin-bottom: 20px;position: relative;}
#contentsmain .inner-Box h2 span.pbac {display: inline-block;background: #fff;border-radius: 10px;padding: 16px 28px;margin-bottom: 14px;}
#contentsmain .inner-Box h2 span.sbac {  }
#contentsmain .inner-Box p.text {font-size: 1.6rem;line-height: 2;font-weight: 500;letter-spacing: 0.16rem;margin-bottom: 66px;position: relative;}
#contentsmain .inner-Box ul{display: -webkit-box;display: -moz-flex;display: -ms-flex;display: -o-flex;display: -ms-flexbox;display: flex;-webkit-box-lines: multiple;-moz-box-lines: multiple;-ms-flex-wrap: wrap;flex-wrap: wrap;margin: 0 auto;max-width: 950px;}
#contentsmain .inner-Box ul li {position: relative;width: 22.6%;margin-right: 3.2%;}
#contentsmain .inner-Box ul li:nth-child(4n) { margin-right: 0px; }
#contentsmain .inner-Box ul li a {  }
#contentsmain .inner-Box ul li a:hover {  }
#contentsmain .inner-Box figure.img {position: relative;top: 0;left: 0;border-radius: 50%;overflow: hidden;margin-bottom: 16px;}
#contentsmain .inner-Box figure.img img{width: 100%;height: auto;  transition: transform 0.4s ease; transform: scale(1); transform-origin: center center;}
#contentsmain .inner-Box p.ltext {font-size: 2rem;line-height: 1.875;font-weight: 500;letter-spacing: 0.2rem;position: relative;color: #fff;position: absolute;top: 77px;left: 50%;transform: translateX(-50%);width: 100%;}
#contentsmain .inner-Box p.ltext span {display: block;font-size: 1.8rem;letter-spacing: 0.18rem;margin-top: -6px;}
#contentsmain .inner-Box ul li:nth-child(1) p.ltext {top: 71px;line-height: 1.3;}
#contentsmain .inner-Box ul li:nth-child(1) p.ltext span{ margin-top: 4px; }
#contentsmain .inner-Box p.dlbtn {font-size: 1.6rem;line-height: 1.875;font-weight: 500;letter-spacing: 0.16rem;margin-bottom: 30px;position: relative;}
#contentsmain .inner-Box p.dlbtn .arr{right:0;display: inline-block;width: 29px;height: 29px;background: #fff;border-radius: 50%;line-height: 1;position: relative;top: -2px;padding-top: 5px;transition: all 0.3s ease-in-out;}
#contentsmain .inner-Box a:hover figure.img img { transform: scale(1.05); }
#contentsmain .inner-Box a:hover p.dlbtn .arr{ right:-4px;}

}
@media screen and (min-width:768px) and ( max-width:1000px) {
#contentsmain .inner-Box ul{ width: 450px;}
#contentsmain .inner-Box ul li {position: relative;width: 49%;margin-right: 2%;}
#contentsmain .inner-Box ul li:nth-child(4n) { margin-right:2%; }
#contentsmain .inner-Box ul li:nth-child(2n) { margin-right:0%; }


}

@media screen and (max-width: 767px) {
.main-title{background: url(../images/orthodontics/sp-h1.jpg)no-repeat top center;background-size: 100% auto;}

#contentsmain {margin: 0 auto 10.67vw;position: relative;text-align: center;}
#contentsmain .inner-Box {padding: 7.47vw 0 0;position: relative;}
#contentsmain .icon{margin: -3.5vw 42.6vw -1.5vw;display: block;position: relative;z-index: 3;}
#contentsmain .inner-Box h2 {font-size: 4.27vw;line-height: 1;font-weight: 500;letter-spacing: 0.85vw;margin-bottom: 4.23vw;position: relative;}
#contentsmain .inner-Box h2 span.pbac {}
#contentsmain .inner-Box h2 span.sbac {display: inline-block;background: #fff;border-radius: 2.67vw;padding: 3.17vw 4.87vw;margin-bottom: 2.83vw;}
#contentsmain .inner-Box p.text {font-size: 3.73vw;line-height: 2;font-weight: 500;letter-spacing: 0.37vw;margin-bottom: 17.6vw;position: relative;text-align: left;margin: 0 5.4vw 9.6vw;}
#contentsmain .inner-Box ul{display: -webkit-box;display: -moz-flex;display: -ms-flex;display: -o-flex;display: -ms-flexbox;display: flex;-webkit-box-lines: multiple;-moz-box-lines: multiple;-ms-flex-wrap: wrap;flex-wrap: wrap;margin: 0 5.1vw;}
#contentsmain .inner-Box ul li {position: relative;width: 47.9%;margin-right: 4.2%;}
#contentsmain .inner-Box ul li:nth-child(2n) { margin-right: 0.0vw; }
#contentsmain .inner-Box ul li a {  }
#contentsmain .inner-Box figure.img {position: relative;top: 0;left: 0;border-radius: 50%;overflow: hidden;margin-bottom: 0.97vw;}
#contentsmain .inner-Box figure.img img{width: 100%;height: auto;  transition: transform 0.4s ease; transform: scale(1); transform-origin: center center;}
#contentsmain .inner-Box p.ltext {font-size: 4.27vw;line-height: 1.875;font-weight: 500;letter-spacing: 0.43vw;position: relative;color: #fff;position: absolute;top: 14.53vw;left: 50%;transform: translateX(-50%);width: 100%;}
#contentsmain .inner-Box p.ltext span {display: block;font-size: 3.73vw;letter-spacing: 0.37vw;margin-top: -1.6vw;}

#contentsmain .inner-Box ul li:nth-child(1) p.ltext {top: 12.73vw;line-height: 1.3;}
#contentsmain .inner-Box ul li:nth-child(1) p.ltext span{ margin-top: 0vw; }

#contentsmain .inner-Box p.dlbtn {font-size: 3.73vw;line-height: 1.875;font-weight: 500;letter-spacing: 0.43vw;margin-bottom: 8.0vw;position: relative;}
#contentsmain .inner-Box p.dlbtn .arr{right:0;display: inline-block;height: 6.13vw;width: 6.13vw;background: #fff;border-radius: 50%;line-height: 1;position: relative;padding: 0vw 1.5vw;top: -0.4vw;left: 0.6vw;padding-top: 0.63vw;transition: all 0.3s ease-in-out;}





}