.nw980 {width: 980px;margin: 0 auto;}
.banner{background: #191919;overflow: hidden;}
.banner img{display: block;width: 100%;height:auto;}

.intro{margin:40px 0;overflow: hidden;}
.intro .tit{font-size: 34px;color: #666;padding-left:98px;}
.intro .tit span{display: block;}
.intro .introi{float: left;width: 88px;margin-right:10px;margin-top:10px;}
.intro .introp{float: left;width: 860px;margin-right:10px;font-size: 16px;}
.intro .introp p{margin-bottom:20px;line-height:170%;}
.intro .introp p.import{color:#ff0d00;}
.intro .introp a { color: #d61212; text-decoration: underline; }

.cotent{ overflow: hidden;}
.title{background: #2e8bbe;color:#fff;text-align: center;font-size: 28px;padding:8px 0;}
.cl{}
.cr .info{margin-bottom:30px;float:left;width: 49%;}
.cr .info .bo{border:1px solid #ccc;border-top:none;padding:20px;font-size: 16px;}
.cr .info dl{margin-bottom:20px;}
.cr .info dl dt{font-weight: bold;}
.cr .info dl dd span{color:#e40000;font-weight: bold;}

.cl .phone{}
.cl .phone .bo{border:1px solid #ccc;border-top:none;padding:20px;font-size: 16px;}
.cl .phone ul{margin-bottom:20px;}
.cl .phone ul li{margin-bottom: 5px;}

.cr{width: 100%;}
.nd-box{display:inline-block;width:100%;}
.address{margin-bottom:30px;overflow: hidden;width:49%;float:right;}
.address .bo{border:1px solid #ccc;border-top:none;padding:20px;font-size: 16px;}
.address .city{background: url(https://img.asiancancer.com/images/newindonesian/active/20180321/address1.jpg) no-repeat left center;overflow: hidden;padding:0 20px 0 48px;}
.address .city .cityl{float: left;font-size: 26px;color:#2e8bbe;}
.address .city .cityl span{font-size: 48px;}
.address .city .cityr{float: right;}
.address .city .cityr a{width: 152px;height: 40px;display:block;line-height: 40px;background: #2e8bbe;color:#fff;border-radius:5px;text-align: center;margin-top:10px;}
.address ul{}
.address ul li{margin-bottom:5px;font-size: 16px;}
.address ul li span{color:#2e8bbe;font-weight: bolder;}
.address ul li .import{color:#e40000;}

.mod-form{width: 820px; margin:0 auto;}
.mod-form .form_title{margin-bottom:20px;font-size:34px;}
.mod-form .item{overflow: hidden;}
form{margin: 0;}
.form-group{margin-bottom: 15px;}
.fl{float: left;}
.fr{float: right;}
.form-group label{display: block; color: #2d648c; font-size: 16px; margin-bottom: 5px;}
.mod-form input[type="text"], .mod-form textarea, .mod-form select{font-size: 14px; line-height: 1.42857143; color: #555; padding: 2px 5px; vertical-align: middle; background-color: #fff; background-image: none; border: 1px solid #ccc; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075); box-shadow: inset 0 1px 1px rgba(0,0,0,0.075); -webkit-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;}
.mod-form textarea{width: 675px; margin-bottom: 20px;}
.mod-form input{width: 260px; height: 32px;}
.clearfix:before, .clearfix:after{content: " "; display: table;}
.clearfix:before, .clearfix:after{content: " "; display: table;}
.mod-form .age{width: 177px;}
.mod-form .gender{width: 300px;}
.mod-form .gender .radio{padding-top: 5px;}
.form-group .radio .radio-inline{display: inline;}
.mod-form .gender .radio-inline{padding-right: 10px;}
.mod-form input[type="radio"]{cursor: pointer;}
.form-group .radio-inline input{width: 25px; height: 18px; vertical-align: bottom;}
.mod-form .quickTitle{margin-bottom: 10px;}
.mod-form .quickTitle button{width: 30%; display: table; margin:10px auto; border-radius: 4px; -webkit-tap-highlight-color: rgba(0,0,0,0); outline: none; border: none; padding: 12px 0; background:#d61212; cursor: pointer; font-size: 16px; font-weight: normal; line-height: 1.42857; text-align: center; vertical-align: middle; white-space: nowrap; color:#fff;}
.mod-form .quickTitle span{width: 30%; display: table; margin:10px auto; border-radius: 4px; -webkit-tap-highlight-color: rgba(0,0,0,0); outline: none; border: none; padding: 12px 0; background:#d61212; font-size: 16px; font-weight: normal; line-height: 1.42857; text-align: center; vertical-align: middle; white-space: nowrap; color:#fff;}
.mod-form select{width:320px; height: 36px; padding: 2px 0; cursor: pointer;}

.file-input{display: none;line-height:30px;position:relative;margin-top:10px;}
.file-input .input-container{width:150px;height:30px;text-align:center;background:#3879d9;color:#fff;border-radius:3px;}
.file-input input{position:absolute;left:0;top:0;opacity:0;}
.file-input #pic-name{position:absolute;left:150px;top:0;font-size:12px;color:#666;}


.env{overflow: hidden;}
.env .env_c{text-align:center;}
.env .env_title{font-size:26px;color:#2e8bbe;text-align: center;margin-bottom:20px;font-weight: bold;}
.swiper-container1{overflow: hidden;position: relative;}
.swiper-container1 .swiper-wrapper{margin-left: 30px;}
.swiper-button-next {right:0 !important;}
.swiper-button-prev{left: 0 !important;}
.env p{text-align: center;padding:10px 0;margin-left: -30px;font-size: 16px;}



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



    .nw980 { width: 100%; }
    .banner{margin-top:50px;}
    .cotent{width: 94%;}
    .intro{margin:30px 0 10px 0;overflow: hidden;}
    .intro .tit{font-size: 18px;text-align: center;color: #666;padding-left: 0;}
    .intro .introi{display: none;}
    .intro .introp{padding:0 10px;width:100%;}

    .cr{width: 100%;float:none;}
    .address{margin-bottom:20px;overflow: hidden;}
    .address .bo{border:1px solid #ccc;border-top:none;padding:20px;font-size: 16px;}
    .address .city{background:none;overflow: hidden;padding:0;}
    .address .city .cityl{float: left;font-size: 18px;color:#2e8bbe;}
    .address .city .cityl span{font-size: 26px;}
    .address .city .cityr{float: right;}
    .address .city .cityr a{width: 100px;height: 30px;display:block;line-height: 30px;background: #2e8bbe;color:#fff;border-radius:5px;text-align: center;margin-top:0;}
    .address ul{}
    .address ul li{margin-bottom:5px;font-size: 16px;}
    .address ul li span{color:#2e8bbe;font-weight: bolder;}
    .address ul li .import{color:#e40000;}

    .mod-form {width:100%;margin: 10px auto;}
    .content .contact p{margin-bottom: 10px;}
    .fl,.fr{float:none;}
    .mod-form input{width:96%;}
    .mod-form select {width: 99%;padding:2px 5px;line-height:1.5;height:32px;}
    .mod-form .age {width: 100%;}
    .mod-form textarea{width: 90%;}
    .mod-form .quickTitle button,.mod-form .quickTitle span{width: 40%;}

    .env{overflow: hidden;margin-top:30px;}
    .env_c img{width:100%;}
    .env .env_c{}
    .env .env_title{font-size:20px;color:#2e8bbe;text-align: center;margin-bottom:10px;font-weight: bold;}
    .swiper-container1{overflow: hidden;position: relative;}
    .swiper-container1 .swiper-wrapper{margin-left: 0;}
    .swiper-button-next {right:0 !important;}
    .swiper-button-prev{left: 0 !important;}
    .env p{text-align: center;padding:10px 0;margin-left: 0;font-size: 16px;}

    .title{background: #2e8bbe;color:#fff;text-align: center;font-size: 1.5rem;padding:4px 0;}
    .cl{float:left;width: 100%;margin-top:30px;}
    .cl img{display: block;width: 100%;}

}

.swiper-slide img {
    border: none;
    width: 100%;
    height: 460px;
    object-fit: contain;
}

@media screen and (max-width:768px) {
    .swiper-slide img {
        border: none;
        width: 100%;
        height: 260px;
        object-fit: contain;
    }
}

/* meeting start */
.row1 {
    grid-area: row1;
    grid-column: 1 / -1;
    text-align: center;
    background: #2e8bbe;
    color: white;
    font-size: 28px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.row21 {
    grid-area: row21;
    grid-column: 1;
    grid-row: 2 / span 2;
    background: #2e8bbe;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
}
.row22 {
    grid-area: row22;
}
.row32 {
    grid-area: row32;
    border-bottom: 1px solid #cccccc;
}
.row23 {
    grid-area: row23;
}
.row33 {
    grid-area: row33;
    border-bottom: 1px solid #cccccc;
}
.row24 {
    grid-area: row24;
}
.row34 {
    grid-area: row34;
    border-bottom: 1px solid #cccccc;
    margin-top: -8px;
}
.row41 {
    grid-area: row41;
    grid-column: 1;
    grid-row: 4 / span 2;
    background: #2e8bbe;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
}
.row42 {
    grid-area: row42;
}
.row52 {
    grid-area: row52;
    border-bottom: 1px solid #cccccc;
}
.row43 {
    grid-area: row43;
}
.row53 {
    grid-area: row53;
    border-bottom: 1px solid #cccccc;
}
.row44 {
    grid-area: row44;
}
.row54 {
    grid-area: row54;
    border-bottom: 1px solid #cccccc;
}
.row61 {
    grid-area: row61;
    grid-column: 1;
    grid-row: 6 / span 2;
    background: #2e8bbe;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
}
.row62 {
    grid-area: row62;
}
.row72 {
    grid-area: row72;
    border-bottom: 1px solid #cccccc;
}
.row63 {
    grid-area: row63;
}
.row73 {
    grid-area: row73;
    border-bottom: 1px solid #cccccc;
}
.row64 {
    grid-area: row64;
}
.row74 {
    grid-area: row74;
    display: inline !important;
    border-bottom: 1px solid #cccccc;
}
.row81 {
    grid-area: row81;
    grid-column: 1;
    grid-row: 8 / span 2;
    background: #2e8bbe;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 16px;
}
.row82 {
    grid-area: row82;
}
.row83 {
    grid-area: row83;
}
.row84 {
    grid-area: row84;
}
.row92 {
    grid-area: row92;
}
.row93 {
    grid-area: row93;
}
.row94 {
    grid-area: row94;
    display: inline !important;
}

.content .meeting-box {
    display: grid;
    /*grid-template-columns: 80px repeat(3, 1fr);*/
    grid-template-columns: 80px auto minmax(250px, 300px);
    grid-template-rows: 55px auto;
    /*grid-column-gap: 10px;*/
    grid-row-gap: 30px;
    grid-template-areas:
    ".      .    row1    .  "
    "row21 row22 row23 row24"
    ".     row32 row33 row34"
    "row41 row42 row43 row44"
    ".     row52 row53 row54"
    "row61 row62 row63 row64"
    ".     row72 row73 row74"
    "row81 row82 row83 row84"
    ".     row92 row93 row94";

    border: 1px solid #ccc;
    box-sizing: border-box;
    min-height: 430px;
}

.content .meeting-box > div {
    box-sizing: border-box;
    padding: 0 10px;
}

.surabaya-num,
.medan-num,
.batam-num,
.batam-num-1,
.jakarta-num
{
    color: red;
    font-size: 20px;
    font-weight: bold;
}
.reserve a {
    box-sizing: border-box;
    background: #2e8bbe;
    color: #FFFFFF;
    padding: 10px;
    border-radius: 20px;
}

@media screen and (min-width:768px) {
    .content .meeting-box {
        grid-row-gap: 10px;
    }
    .meeting-box .date,
    .meeting-box .time
    {
        box-sizing: border-box !important;
        padding-top: 16px !important;
    }
    .meeting-box .reserve a {
        box-sizing: border-box;
        background: #2e8bbe;
        color: #FFFFFF;
        padding: 10px;
        border-radius: 20px;
        margin-top: 6px;
        display: inline-block;
    }
}

@media screen and (max-width:768px) {
    .row21 {
        grid-area: row21;
        grid-column: 1;
        grid-row: 2 / span 6;
        background: #2e8bbe;
        color: white;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 16px;
    }
    .row41 {
        grid-area: row41;
        grid-column: 1;
        grid-row: 8 / span 6;
        background: #2e8bbe;
        color: white;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 16px;
    }
    .row61 {
        grid-area: row61;
        grid-column: 1;
        grid-row: 14 / span 6;
        background: #2e8bbe;
        color: white;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 16px;
    }
    .row81 {
        grid-area: row81;
        grid-column: 1;
        grid-row: 20 / span 6;
        background: #2e8bbe;
        color: white;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 16px;
    }
    .content .meeting-box {
        display: grid;
        grid-template-columns: 80px 1fr;
        grid-template-rows: 55px auto;
        /*grid-column-gap: 10px;*/
        grid-row-gap: 10px;
        grid-template-areas:
    ".     row1"
    "row21 row22"
    ".     row32"
    ".     row23"
    ".     row33"
    ".     row34"
    ".     row24"
    "row41 row42"
    ".     row52"
    ".     row43"
    ".     row53"
    ".     row54"
    ".     row44"
    "row61 row62"
    ".     row72"
    ".     row63"
    ".     row73"
    ".     row74"
    ".     row64"
    "row81 row82"
    ".     row92"
    ".     row83"
    ".     row93"
    ".     row94"
    ".     row84";

        border: 1px solid #ccc;
        box-sizing: border-box;
        min-height: 340px;
    }

    .content .meeting-box > div {
        box-sizing: border-box;
        padding: 5px 10px;
    }
    .reserve {
        text-align: right;
    }
    .reserve a {
        display: inline-block;
        margin-bottom: 6px;
    }

    .row24,
    .row44,
    .row52,
    .row53,
    .row64,
    .row72,
    .row73,
    .row74,
    .row93,
    .row94
    {
        box-sizing: border-box;
        border-bottom: 1px solid #ccc;
    }
}


/* meeting end */
