/*所有元素漸變0.5秒*/
*{transition: all .5s}

/*共用*/
.wrap_all{word-break: keep-all;overflow-wrap: break-word;-webkit-hyphens: auto;-moz-hyphens: auto;hyphens: auto;-webkit-text-size-adjust: 100%;}

@media all and (min-width: 1px) and (max-width: 1200px){
    body {font-family:"Microsoft JhengHei";margin: 0;width: auto;/*background-image: url(../images/0811076_bg_paper.jpg);background-position: left 0px;background-size: 100%;border-radius: 0px;background-repeat: repeat;word-break: keep-all;overflow-wrap: break-word;-webkit-hyphens: auto;-moz-hyphens: auto;hyphens: auto;-webkit-text-size-adjust: 100%;*/}
    .br_mb{ display:block;}
    .br_pc{display:none;}
    .mb{ display: inherit}
    .pc{ display: none;}
    .center{ text-align:center; margin:0 auto;}

    /*內容*/
    .container {width: 100%;display: table;padding: 0 0 0;/*background-color: #ffcdcd !important;background: rgb(250,229,174);background: linear-gradient(0deg, rgba(250,229,174,1) 0%, rgba(250,229,174,1) 15%, rgba(254,245,216,1) 100%);*/}

    /*主圖大標*/
    /* .banner_bg{height: auto;overflow:auto;padding: 1.5rem 1rem;background:url(../images/1306051_icon_bg_left.png) no-repeat top 15% left -25% / 46%, url(../images/1306051_icon_bg_right.png) no-repeat top 20% right -29% / 56% ,url(../images/1306051_banner_bg.png) no-repeat top center / cover;}

    .title {width: 100%;}
    .title h1 {font-size: 4.5rem;line-height: 3.8rem;padding: 0;}
    .title span {font-size: 4.8rem;} */
    .banner_bg{height: auto;overflow:auto;padding: 1.5rem 1rem;background:url(../images/1306051_icon_bg_left.png) no-repeat top 13% left -26% / 46%, url(../images/1306051_icon_bg_right.png) no-repeat top 17% right -29% / 56% ,url(../images/1306051_banner_bg.png) no-repeat top center / cover;}

    .title {width: 100%;}
    .title h1 {font-size: 4.5rem;line-height: 3.8rem;padding: 0;}
    .title h2 {margin: -.5rem auto 2rem;}
    .title span {font-size: 4.8rem;}

    .cover{width: 100%;display: flex;flex-direction: column;justify-content: center;}
    .cover .cover_book {width: 100%;display: flex;justify-content: center;}
    .cover img {width: 100%;}

    .web {width: 70%;margin: 2% auto;}
    .web > div {display: inline-block;}
    .web .box {height: auto;margin: 0 0px 0.5%;width: 100%;border-radius: 0px;}
    .web .gray_bg1 {background-image: url(../images/1306051__icon1.png);background-position: 400px 30px;background-repeat: no-repeat;background-size: 12%;}
    .web .gray_bg2 {background-image: url(../images/1306051__icon4.png);background-position: 400px 30px;background-repeat: no-repeat;background-size: 12%;}
    .web .yellowwhite{background-color: #fff;}
    .web .yellowwhite_bg1 {background-image: url(../images/1306051__icon2.png);background-position: 400px 30px;background-repeat: no-repeat;background-size: 12%;}
    .web .yellowwhite_bg2 {background-image: url(../images/1306051__icon3.png);background-position: 400px 30px;background-repeat: no-repeat;background-size: 12%;}

    .linkweb,.linkweb2 {display: inline-block;}
    .linkweb a {display: inline-block;font-size: 1.5em;line-height: 1em;font-weight: bold;color: #000;margin: 0 0 0;display: block;}
    .linkweb2 a {display: inline-block;font-size: 1.5em;font-weight: bold;color: #000;margin: 0 0 0;display: block;}
    .event_top {margin-top: -4%;margin-bottom: 12%;}


    .second_area{width: 100%;flex-wrap: wrap;}
    /*月旦品評家--時論議題‧名師智匯‧爭點釐清*/
    .media {width: 100%;text-align: center;width: 90%;padding: 5% 5% 0;}
    /* .media {text-align: center;width: 90%;padding: 5% 5% 4%;} */
    .media h2{ margin:0; padding:0;}
    .media h2 img {text-align: center;padding: 0 5% 1%;width: 90%;}
    .media-img img {border-radius: 10px;border: 6px #d6c491 solid;padding: 1px;margin-bottom: 4%;}
    .media h4 {font-size: 2.2rem;line-height: 1rem;color: #00667a;padding: 0;margin: 1.7% 2% 2.7%;}
    .media h4 span {display: inline-block;padding: 0 .5rem;}

    /*焦點議題*/
    .focus {width: 100%;text-align: center;font-weight: bold;padding: 0 0 3.5%;}
    /* .focus {text-align: center;font-weight: bold;padding: 1% 0 3.5%;} */
    .focus mark {color: #c8852f;background-color: #fff0;}
    .focus .focus_title {font-size: 2.6rem;display: block;margin: 2rem auto 1.25rem;}
    .focus ul{ padding: 0 .5%;margin-left: 0;}
    .focus ul li {list-style-type: none;display: inline-block;line-height: 1.8rem;margin: .5rem .25rem;font-weight: normal;}
    .focus ul li a {display: block;color: #000;font-family: "Microsoft JhengHei",Arial;font-size: 1.8rem;font-weight: bold;}
    .focus ul li a:hover{ font-weight: bold;}

    .sale{padding: 2% 5% 0;width: 90%;}
    .sale h1 {font-size: 2.6rem;}
    .sale h2 {width: 48%;font-size: 2.2rem;padding: 1rem 0 .8rem;}
    .sale ol {width: 90%;margin: 5rem auto 1rem;font-size: 1.5rem;line-height: 2.2rem;padding: 1rem 1rem 1rem 3rem;}
    .sale ol::before {content: '★ ★ ★ ★ ★';width: 400px;position: absolute;top: -9%;left: 40%;}
    .sale ol::after {content: '';width: 380px;height: 380px;background: #ffffff;border-radius: 50rem;position: absolute;top: -18%;left: 48%;transform: translateX(-50%);z-index: -5;}

    .booktitle {text-align: center;width: 100%;float: left;margin-top: 3%;}
    .book {width: 92%;padding:0 4%;display: flex;justify-content: center;flex-wrap: wrap;}
    .book img {width: 140px;}

    .discount {display: flex;flex-direction: column;padding: .5rem;}

    .note {width: 100%;padding: 0;}
    .note ul{width: 46%; padding: .5rem 2rem;margin: .5rem auto 2rem;}
    .note li {font-size: 1em;line-height: 1.3em;font-weight: normal;color: #000;margin: 0 0 0.35em 0;}
    .note h1 {font-size: 1.2em;line-height: 1em;font-weight: bold;color: #d86262;}

    /*header footer 開始 */	
    #header-share {display: none;}
    #header-rwd {background-color: #C00;text-align: center;width: 100%;display: block;padding-top: 5px;}
    #Bodyfooter {width: 100%;}

    /*頁尾*/
    .footerArea1 {width: 90% !important;display: inherit !important;background-color:#00BCD4 !important;padding: 6% 0 6% 10% !important;}
    /* .footerArea2 {width: 80% !important;margin: 0px;padding-right: 10%;padding-left: 10%;}
    .footerArea2 .logo2{display: none;}
    .footerArea2 span {clear: both;float: none;}
    .footerArea2 div {text-align: left;width: 100%;font-size: 13px;}
    .footerArea2 div p {clear: both;float: none;word-break: normal;} */

    }


    @media all and (min-width: 768px) and (max-width: 1200px){
        .sale ol li{margin: 0 0 1rem .5rem;}
        .sale>ol:nth-child(3) li{margin: 0 0 1rem 5.5rem;}
    }

    /*解析度  769px 以下*/
    @media screen and (max-width:769px) {

    }

    /* ----------- 手機 ----------- */
    @media (max-width: 767px){
        /*.banner_bg{padding: 2rem 1rem;background:url(../images/1306051_icon_bg_left.png) no-repeat top 10% left -30% / 50%, url(../images/1306051_icon_bg_right.png) no-repeat top 10% right -35% / 60% ,url(../images/1306051_banner_bg.png) no-repeat top center / cover;}*/
        .banner_bg{background: url(../images/1407082_top_bg.png) no-repeat top center / 100%;height: 275px;}

        .title h1 {font-size: 3.1rem;line-height: 3.8rem;padding: 0 0  1rem;margin: auto;}
        .title h2 {font-size: 1.6rem;margin: 0 auto 1.8rem;}
        .title h2 a {padding: .25rem 2rem;}
        .title span {font-size: 3.3rem;}
        .cover img {width: 100%;}
        .web {width: 95%;}
        .web .purple {width: 90px;border-radius: 10px;margin: 3%;padding: 2% 0;display: inline-block;text-align: center;font-size: 1.6rem;}
        .web .sky {width: 90px;border-radius: 10px;margin: 3%;padding: 2% 0;display: inline-block;text-align: center;font-size: 1.6rem;font-weight: bold;color: #fff;}
        .linkweb a , .linkweb2 a {font-size: 1.3rem;}
        .web .gray_bg1 , .web .gray_bg2 , .web .yellowwhite_bg1 , .web .yellowwhite_bg2 {background-position: 280px 18px;}

        .media h2 img {width: 68%;text-align: center;padding: 0 5% 1%;}
        .media h4 {font-size: 1.5rem;}
        .media h4 span {display: block;line-height: 2.25rem;}

        .focus {padding: 1% 0 5%;}
        .focus .focus_title {font-size: 1.9rem;margin: 1.25rem auto .5rem;}
        .focus ul {padding: 0 .5% 0 2%;margin: 0;text-align: left;}
        .focus ul li{margin: 1.5% 0;}
        .focus ul li a {font-size: 1.2rem;line-height: 1.5rem;font-weight: bold;}
        .focus .more a {font-size: 1.05rem;padding: 1rem 0 0;}

        .sale{overflow-x:hidden; word-wrap: break-word;max-width:100%;height:auto;}
        .sale h1 {font-size: 1.9rem;}
        .sale h2 {width: 100%;font-size: 1.5rem;padding: 0 0 .5rem;margin: .8rem auto 1rem;text-align: center;color: #ae6200;border-bottom: 2px solid #dfb57dcc;position: relative;left: -1.5rem;}
        .sale ol {width: 80%;font-size: 1.1rem;line-height: 1.5rem;margin: .5rem auto ;}
        .sale ol::before {content: unset;}
        .sale ol::after {content: unset;}
        .sale ol li{margin: 0 0 1rem .5rem;}
        .sale>ol:nth-child(3) li{margin: .5rem 0 1rem .5rem;}
        .sale div a {padding: .2rem 1rem;}
        .sale p {font-size: .95rem;}

        .booktitle h2 {font-size: 1.9rem;padding: 1.25rem 0 0;}
        .discount h3 {font-size: 1.35rem;line-height: 2rem;padding: .3rem;}
        .discount h3 a {font-size: 1.3rem;}

        .note ul {width: 85%;padding: .5rem 1rem;}
        .note li {font-size: .95rem;margin:auto;}
    }


    /*手機_直式*/
    @media(max-width: 767px){
    /* .title h2 img, .booktitle h2 img {width: 90%;}
    .focus .focus_title a {font-size: 1.25rem;vertical-align: text-bottom;text-decoration: none;padding: 3px 8px 4px;background-color: #fff;border-radius: 50px;color: #c8852f;display: inline-block;border: 1px #ce852f solid;}
    .book img {width: 190px;}
    .media h4 {font-size: 1.65rem;line-height: 2rem;color: #00667a;padding: 0;margin: 1.7% 2% 2.7%;}
    .note ul {margin-left: -14%;}
    .note ul li {margin: 0 0 5px 0;} */
    }

    /*手機_橫式*/
    @media screen and (min-width:600px) and (max-width:769px) {
	    /* .title h2 img, .booktitle h2 img {width: auto;}
	    .media h2 img {width: auto;}
	    .book {display: flex;justify-content: center;}
	    .book img {width: 120px;} */
    }

    /* ----------- iPad ----------- */
    /*ipad_直式*/
    @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
        /*==============*/
        /* .title h1 {font-size: 4rem;line-height: 4rem;}
	    .title h2 img, .booktitle h2 img {width: 320px;}
	    .discount h4 {margin-left: -1%;font-size: 1.1rem;margin-bottom: 0.3%;	}
	    .discount2 h4 a {color: #000;}
	    .booktitle {margin-top: 3.5%;}	

	    .focus {padding: 1% 0 3%;}
	    .focus .focus_title a {font-size: 1.25rem;vertical-align: text-bottom;text-decoration: none;padding: 3px 8px 4px;background-color: #fff;border-radius: 50px;color: #c8852f;display: inline-block;border: 1px #ce852f solid;}
	    .media {padding: 4% 5%;}
	    .media-all {width: auto;margin: 0 auto;display: inline-flex;flex-wrap: wrap;justify-content: center;} */
        /*==============*/
    }

    /*ipad_橫式*/
    @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
	    /* .title h1 {font-size: 4rem;}
	    .cell-lg-3 {display: contents;}
	    .title h2 img, .booktitle h2 img {width: 380px;}

	    .media {padding: 3% 5% 0%;}
	    .media h2 img {width: auto;}
	    .media-img img {width: 210px;}
	    .book {display: inline-flex;justify-content: center;width: 100%;}
	    .book img {width: 150px;}
	    .booktitle {margin-top: 3%;}
	    .discount span, .discount2 span {margin-right: 3px;margin-left: -38px;}
	    .discount2 {font-size: 1.6rem;}
	    .discount2 h4 a {color: #000;}	
	    .focus {padding: 1% 0 1%;}
	    .focus .focus_title a {font-size: 1.25rem;vertical-align: text-bottom;text-decoration: none;padding: 3px 8px 4px;background-color: #ffffff;border-radius: 50px;color: #c8852f;display: inline-block;border: 1px #ce852f solid;} */
    }

    /* ----------- iPad Pro ----------- */
    /* Portrait and Landscape */
    @media only screen and (min-width: 1024px) and (max-height: 1366px) and (-webkit-min-device-pixel-ratio: 1.5) {
    }

    /* 直Portrait */
    @media only screen and (min-width: 1024px) and (max-height: 1366px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1.5) {
	    /* .title h1 {font-size: 5.5rem;}
	    .cell-lg-3 {display: contents;}
	    .title h2 img, .booktitle h2 img {width: 380px;}

	    .media {padding: 3% 5% 0%;}
	    .media h2 img {width: auto;}
	    .media-img img {width: 210px;}
	    .book {display: flex;justify-content: center;}
	    .book img {width: 150px;}
	    .booktitle {margin-top: 3%;}
	    .discount span, .discount2 span {margin-right: 3px;margin-left: -38px;}
	    .discount2 {font-size: 1.6rem;}
	    .discount2 h4 a {color: #000;}
	    .discount h4 {margin-left: -1%;font-size: 1.45rem;}
	    .focus {padding: 1% 0 1%;}
	    .focus .focus_title a {font-size: 1.25rem;vertical-align: text-bottom;text-decoration: none;padding: 3px 8px 4px;background-color: #ffffff;border-radius: 50px;color: #c8852f;display: inline-block;border: 1px #ce852f solid;} */
    }

    /* 橫Landscape */
    @media only screen and (min-width: 1024px) and (max-height: 1366px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1.5) {
    }

    /*平板尺寸*/
    @media screen and (min-width:600px) and (max-width:769px) {
        .mb{ display: none !important;}
        .pc{ display: inherit !important;}
        .br{ display: initial;}
        /*最新活動*/
        /* .news {margin: 0 0 0 10%;padding-left: 0;width: 88%;display: inline-block;float: initial;}
        .more {padding: 0 0 2px;margin: 0.3% 3.5% 0 0;float: right;border-bottom: 1.5px #ee7d5e dotted;line-height: 1em;width: auto;display: block;} */
        
        /*頁尾*/
        /* .footerArea1 {width: 93% !important;display: inherit !important;background-color:#bf9e6f !important;padding: 6% 0 6% 7% !important;} */
    } /*平板尺寸-end-*/

    /*解析度  480px 以下*/
    @media screen and (max-width:480px) {
        /* #BodyContent {width: 100%;margin-left: auto;-moz-background-size:100% 12%;-webkit-background-size:100% auto;-o-background-size:100% auto;background-size:100% auto;padding-top:30px;} */
    }


