@media (min-width: 1300px) { .sectionA .CommonOtherpongetitle { padding-left: 40px; }
  .sectionA .CommonOtherpongetitle::after { left: 40px; } }

@media (min-width: 1300px) { .sectionA .container { max-width: 1240px; } }

.sectionA .con { margin-bottom: 50px; margin-top: 35px; }

.sectionA .con ul { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-flow: wrap; -ms-flex-flow: wrap; flex-flow: wrap; }

.sectionA .con ul li { width: 33.33333%; padding: 0 20px; margin-bottom: 40px; }

.sectionA .con ul li a { display: block; }

.sectionA .con ul li a .img { overflow: hidden; }

.sectionA .con ul li a .img > img { -webkit-transition: 0.5s ease all; transition: 0.5s ease all; }

.sectionA .con ul li a:hover .img > img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); }

.sectionA .con ul li a:hover .img .write { opacity: 1; }

.sectionA .con ul li a:hover .text { background: rgba(15, 120, 178, 0.91); }

.sectionA .con ul li a:hover .text .title { color: #fff; }

.sectionA .con ul li a:hover .text .desc { color: #fff; }

.sectionA .con ul li a:hover .text .more { background: #fff; color: #0f78b2; }

.sectionA .con ul li a .img { position: relative; overflow: hidden; background: #fff; height: auto; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-transition: 0.5s ease all; transition: 0.5s ease all; }

.sectionA .con ul li a .img .write { position: absolute; left: 0; right: 0; z-index: 1; font-size: 18px; opacity: 0; -webkit-transition: 0.5s ease all; transition: 0.5s ease all; color: #fff; background: rgba(15, 120, 178, 0.79); top: 0; bottom: 0; margin: auto; width: 100%; height: 100%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; }

.sectionA .con ul li a .img > img { width: 100%; }

.sectionA .con ul li a .text { -webkit-transition: 0.5s ease all; transition: 0.5s ease all; border: 1px solid #b3b3b3; border-top: 0; background: #fff; padding: 20px 25px; }

.sectionA .con ul li a .text .title { font-size: 18px; color: #1d1d1d; -webkit-transition: 0.5s ease all; transition: 0.5s ease all; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.sectionA .con ul li a .text .desc { font-size: 14px; color: #969696; margin: 10px 0; line-height: 1.8; -webkit-transition: 0.5s ease all; transition: 0.5s ease all; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; height: 100px; }

.sectionA .con ul li a .text .more { width: 92px; height: 28px; font-size: 14px; -webkit-transition: 0.5s ease all; transition: 0.5s ease all; color: #fff; background: #0f78b2; margin-top: 20px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; }

@media (max-width: 1199px) { .sectionA .con ul li { padding: 0 20px; } }

@media (max-width: 991px) { .sectionA .con ul li { width: 50%; padding: 0; padding-right: 5px; }
  .sectionA .con ul li:nth-of-type(2n+0) { padding-left: 5px; padding-right: 0; }
  .sectionA .con ul li { margin-bottom: 10px; } }

@media (max-width: 575px) { .sectionA .con ul li a .text { padding: 15px; }
  .sectionA .con ul li a .text .title { font-size: 16px; }
  .sectionA .con ul li a .text .more { width: auto; height: auto; padding: 5px; font-size: 14px; }
  .sectionA .con { margin-top: 30px; margin-bottom: 20px; }
  .sectionA .con ul li a .img { height: auto; } }