.materials{padding:100px 0;}
.materials-text{font-size:16px;}
.materials-text p+p{margin-top:15px;}
.materials-nav{text-align: center; margin-top:50px;}
.materials-nav>ul{display: block; font-size: 0;}
.materials-nav>ul>li{display: inline-block; padding:8px;}
.materials-nav>ul>li>a{display: block; line-height:22px; padding: 8px 18px; font-size:16px; border:1px solid #686868;}
.materials-nav>ul>li.on>a{color:#768047; border-color:#768047;}
.materials-list{ margin-top:50px;}
.materials-list>aside{display: none; text-align: center;}
.materials-list>aside.on{display:block;}
.materials-list>aside>ins{display:inline-block; overflow:hidden;  transition:.4s;}
.materials-list>aside>ins>img{display: block;}
.materials-list>aside>ul{display: block; text-align: left; padding-top:20px; margin:0 -20px;}
.materials-list>aside>ul:after{display: block; content: ''; clear: both;}
.materials-list>aside>ul>li{float: left; width: 50%; margin-top:30px; padding:0 20px;}
.materials-list>aside>ul>li>h3{font-size: 16px; margin-bottom:5px;}
.materials-list>aside>ul>li>p{color:#686868;}
.materials-list>aside>ul>ol{display: none;}
.materials-list>aside>ul>ol:nth-child(4n){float: left; width: 100%;}
@media(max-width:1200px){
.materials{padding:50px 0;}
.materials-text{font-size:15px;}
.materials-text p+p{margin-top:10px;}
.materials-nav{margin-top:30px;}
.materials-nav>ul>li{padding:4px;}
.materials-nav>ul>li>a{padding:5px 15px; font-size:15px;}
.materials-list{ margin-top:30px;}
.materials-list>aside>ul{padding-top:10px; margin:0 -10px;}
.materials-list>aside>ul>li{margin-top:20px; padding:0 10px;}
}
@media(max-width:767px){
.materials{padding:20px 0;}
.materials-text{font-size:14px;}
.materials-text p+p{margin-top:5px;}
.materials-nav{margin-top:10px;}
.materials-nav>ul>li>a{padding:4px 12px; font-size:14px;}
.materials-list{ margin-top:15px;}
.materials-list>aside>ul{padding-top: 5px; margin: 0;}
.materials-list>aside>ul>li{float: none; width: 100%; margin-top:10px; padding: 0;}
}

.care{padding:100px 0; background:#f8f9fa;}
.care-box{display: block;}
.care-box:after{display: block; content:''; clear: both;}
.care-box>ins{float: left; width:50%; overflow: hidden;}
.care-box>ins>img{display: block; transition: .3s;}
.care-box>ins:hover>img{transform: rotate(1deg) scale(1.08);}
.care-box>span{float: left; width: 50%; padding-left:6%;}
.care-box>span>h2{font-size: 35px; margin:30px 0;}
.care-box>span>aside{display: block; color:#686868;}
.care-box>span>aside p+p{margin-top:10px;}
.care-list{margin-top:50px;}
.care-list>ul{margin: 0 auto;}
.care-list>ul>li{background:#fff; margin-top: 20px; padding:10px 20px; cursor:pointer; transition: .3s; }
.care-list>ul>li.on{padding-bottom:20px;}
.care-list>ul>li>h3{font-size:20px; padding:5px 0;}
.care-list>ul>li>h3:after{display: block; content:''; clear: both;}
.care-list>ul>li>h3>i{float: right; line-height: inherit; transition: .3s; width:25px; height:25px; line-height:28px; margin-top:4px; text-align: center; border-radius: 50px; background: #f8f9fa;}
.care-list>ul>li.on>h3>i{transform:rotate(180deg);}
.care-list>ul>li>h3>b{display: block;}
.care-list>ul>li>p{font-size:16px; overflow: hidden; transition: .15s linear; max-height:0; color:#686868;}
.care-list>ul>li.on>p{max-height:400px;}
@media(max-width:1200px){
.care{padding:50px 0;}
.care-box>span{padding-left:20px;}
.care-box>span>h2{font-size:28px; margin:20px 0;}
.care-box>span>aside{font-size: 14px;}
.care-list{margin-top:20px;}
.care-list>ul>li>h3{font-size:18px;}
.care-list>ul>li>p{font-size:15px;}
}
@media(max-width:992px){
.care-box>ins{float:none; width:100%;}
.care-box>span{float: none; width:100%; padding-left:0;}
.care-box>span>h2{margin:20px 0 10px 0;}
}
@media(max-width:767px){
.care{padding:20px 0;}
.care-box>span>h2{font-size:22px; margin:10px 0 5px 0;}
.care-list{margin-top:10px;}
.care-list>ul>li>h3{font-size:16px;}
.care-list>ul>li>p{font-size:14px;}
.care-list>ul>li{padding:10px;}
}
