﻿/*container css*/
.container-fluid {
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    font-family: -apple-system,BlinkMacSystemFont,sans-serif,"microsoft Jhenghei";
    color: #333;font-size: 14px;box-sizing: border-box;padding-right: 0px;padding-left: 0px;margin-right: auto;margin-left: auto;
}


.c_title {                                                         /*cont*/
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    list-style: none;-webkit-box-direction: normal;box-sizing: border-box;font-family: inherit;color: #555;font-size: 18px;font-weight: 700;margin-bottom: 0px;margin-top: 0px;    /*cont卡片顶部填充距离*/
}
/*con top*/
.con-topbox {max-width:1280px;height:auto;text-align:center;margin-top:36px;margin-bottom:26px;}
.con-topTIc {display:flex; }
.con-topTI {position:relative; width:25%;}
.con-topTI img{width: auto; height: 40px;}
.con-topTI h3{font-size: 15px;}

/*cont_about ****************************/
.about-box {text-align:left;margin: 10px; max-width:730px;max-height:650px;}
.about-title {font-size:30px;font-family:Arial;font-weight:bolder;line-height:0.7;}
.about-title a {text-decoration: none; }
.about-word {font-size:19px;line-height:1.2;font-family:Arial;}
/*cont_about start **********************/


/*文字上拉动画*/
.p_wra {width:33.333%;height:auto;}
.wrapper{
            position: relative; /* 必须设置为相对定位 */
			width: 100%;
			height: 100%;
            /*max-height:600px ;
			/**border: 0px solid #ccc;*/
			border-radius: 8px;     /*边框圆角半径*/
			margin: 0px auto;
			position: relative;
			overflow: hidden;
            background-size: cover; /*等比例缩放以填充容器 */
		}
        .wrapper img {
            position:absolute;
            top: 50%; /* 上边界与容器顶部居中对齐 */
            left: 50%; /* 左边界与容器左侧居中对齐 */
            transform: translate(-50%, -50%); /* 水平、垂直居中 */
            /*max-width: none !important;  取消默认最大宽度限制 */
            /*max-height: 600px !important;  取消默认最大高度限制 */
            object-fit: cover ;  /*等比例缩放以填充容器 */
            border-radius: 8px;     /*边框圆角半径*/
            width:auto;
            height:100%;
        }
            
		.wrapper hgroup{
			position: absolute;
			left: 0;
            bottom:-88%;
			width: 100%;
			height: 100%;
            max-height:100%;
            background: rgba(3, 32, 78, 0.4);
            transform-origin: bottom center; /* 设置基点 */
            transition: all 0.2s ease-in 0s; /* 设置过渡效果 */
            border-radius: 8px;     /*边框圆角半径*/
		}
		.wrapper:hover hgroup{
			position: absolute;
			left: 0;
			bottom: 0; /*位置：top起始位置在顶部（从上往下滑）； bottom起始位置在底部（从下往上滑）*/
            border-bottom: 2px solid #f00;/*底部线*/
            border-radius: 8px;     /*边框圆角半径*/
            padding-top:40px;

            height: 100%;
            max-height:100%;
            background: rgba(3, 32, 78, 0.90);
            border-radius: 6px;     /*边框圆角半径*/
		}
		.wrapper hgroup h2:nth-child(1){ /*组内第一条H2*/
			text-align: left;
			color: #fff;
			font-weight: normal;
			margin: 5px 0px 0px 20px; /*top right bottom left*/
            line-height:1.5;
            font-size:24px;
            /*font-size: 1.1vw;  /*1% of the parent's width   (CSS 字体跟随父项自适应大小)*/
		}
        .wrapper hgroup h2:nth-child(2){ /*组内第二条H2*/
			text-align: left;
			color: #fff;
			font-weight: normal;
			margin: 22px;
            line-height:2.5;
            font-size:17px;
            /*font-size: 0.9vw;  /*1% of the parent's width   (CSS 字体跟随父项自适应大小)*/
		}

        .btn-position { /*container卡片（按钮:【更多信息】属性）*/
     position: absolute; /* 按钮设置绝对定位 */
        bottom: 0px; /* 按钮与父元素底边距离 */
        /*left: 80%;  按钮居中 */
        right: 0;
        /*transform: translateX(-50%); /* 左右居中 */
        padding: 0px 10px;
        background-color:transparent;
        text-decoration: none;
        margin-top: auto;
}
.btn-position button{border-radius:10px 10px 10px 10px;background-color:rgba(56, 116, 161, 0.97);border:none;padding:3px 5px 3px 5px;}
.btn-position a{color:#fff;}
.btn-position button:hover{background-color:rgba(42, 134, 203, 0.97);color:#fc7f47;}
/**********************************************************************/








