@charset "UTF-8";
*, ::before, ::after {
  margin: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


/*--------------------------------------------------------------------------------
	font
--------------------------------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;1,100;1,300;1,400;1,500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100;300;400;500;700&display=swap');

/*--------------------------------------------------------------------------------
	main -all
--------------------------------------------------------------------------------*/

.c-main-inner{
	width:100%;
	max-width:1260px;
	padding:15px 30px 40px 30px;
	margin:0 auto;
}

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

	.c-main-inner{
		min-width:initial;
		max-width:100%;
    min-width: 100%;
		padding:25px 15px 40px 15px;
	}

}

/*-------------------


ipager Dtail


--------------*/
.iWrap {
  margin: 0px auto 0px auto;
  position: relative;
  padding-bottom:30px;
  padding-top: 15px;
  padding-left: 10%;
  padding-right: 10%;
  max-width: 100%;
  width: 100%;
  display: block;
}
article {
  float: right;
  width: calc(100% - 350px);
}




/*-------------------


ipager right


--------------*/
.Content {
  margin: 0px auto 30px auto;
  position: relative;
  line-height: 1.7;
  width: 100%;
  max-width: 100%;
  display: block;
  word-wrap: break-word;
  word-break: break-all;
}
.Content::after {
  content: "";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}

/* -------------------------
 return Button
------------------------- */
.mosh-btn {
  font-family: Microsoft JhengHei, Arial Black, LiHei Pro;
  border: #d14f7b solid 2px;
  min-width: 135px;
  padding: 10px 30px;
  border-radius: 40px;
  color: #d14f7b;
  background: #fff;
  font-size: 15px;
  font-weight: 700;
  text-transform: uppercase;
  -webkit-transition-duration: 500ms;
  transition-duration: 500ms;
  border-radius: 40px 50px 50px 0;
}
.mosh-btn:hover {
  background-color: #ff6f9f;
  color: #fff;
}
@media screen and (max-width:1366px) {
  .iWrap {
    padding-left: 10%;
    padding-right: 10%;
    margin-top: 30px
  }
}
@media screen and (max-width:1280px) {
  .iWrap {
    padding-left: 7%;
    padding-right: 7%;
  }
}
@media screen and (max-width:1024px) {
  .iWrap {
    padding-left: 5%;
    padding-right: 5%;
  }
}
@media screen and (max-width:911px) {
  .iWrap {
    margin-top: 15px
  }
}
@media screen and (max-width:853px) {
  .iWrap {
    padding-top: 0;
    padding-bottom: 40px;
    padding-left: 15px;
    padding-right: 15px;
    margin-top: 15px
  }
  .iWrap:before {
    top: -30px;
  }
  /*----右側txt col-------*/
  article {
    float: left;
    width: 100%;
    margin-top: 5px;
    clear: both;
    display: block;
    overflow: hidden
  }
  .Content {
    margin-top: 20px;
    padding: 10px;
  }
  .TxtEditor  {
    margin-bottom: 60px
  }
}
@media screen and (max-width:768px) {
  .TxtEditor  {
    margin-bottom: 30px
  }
}
@media screen and (max-width:640px) {
  .iWrap {
    margin-top: 30px
  }
  .Content {
    margin-top: 10px
  }
}
/*==========================================
 選單
===========================================*/
aside {
  float: left;
  width: 280px;
  padding: 5px;
  margin: 20px auto 30px auto;
  display: block;
  z-index: 99
}
.leftMenu {
  box-shadow: 0 0 4px rgba(0, 0, 0, .16) !important;
  background-color: #fff;
  position: relative;
  padding: 30px 0;
  border-right: solid 1px #e8eaf1;
  border-bottom: solid 1px #e8eaf1;
  width: 100%;
  display: flex;
  flex: initial;
}
.storageBtn {
 
  font-style: normal;
  box-sizing: border-box;
  border-bottom: #ddd solid 1px;
  letter-spacing: 0.5px;
  font-style: normal;
  font-size: 1.1rem;
  line-height: 1.5;
  font-weight: 400;
  display: flex;
  width: 100%;
  flex: 0 0 100%;
  max-width: 100%;
  padding: 16px;
  position: relative;
  transition: all 0.3s;
  -webkit-transition: 0.3s all ease;
  -moz-transition: 0.3s all ease;
  -o-transition: 0.3s all ease;
  transition: 0.3s all ease;
}
.storageBtn:last-child {
  border-bottom: none;
}
.storageBtn:hover, .storageBtn:focus, .storageBtn.active {
  background-color: #faf8ed;
  color: #527dcf;
}
.storageBtn:before {
  content: "";
  display: block;
  position: absolute;
  left: 15px;
  top: 25px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: transparent
}
.storageBtn:hover:before {
  content: "";
  display: block;
  position: absolute;
  left: 15px;
  top: 25px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #f08300;
}
aside .storageMenu {
  margin-bottom: 1px;
  flex: 0 0 100%;
  max-width: 100%
}
.storageBtn > span {
  font-family: 'Noto Sans TC', Microsoft JhengHei, Arial Black, LiHei Pro;
  font-style: normal;
  display: table;
  width: 100%;
  height: 100%;
  position: relative;
  padding-left: 15px;
}
.storageBtn > span a {
  display: block;
  color: #000;
  position: relative;
  padding: 10px 0;
  font-family: 'Noto Sans TC', Microsoft JhengHei, Arial Black, LiHei Pro;
  font-style: normal;
  font-size: 1.1rem;
}
/*--2std----*/
.storageBox {
  padding: 15px 20px;
  display: none;
  letter-spacing: 0.1px
}
.storageBox li a {
  padding: 10px 0;
  display: block;
  position: relative;
  font-family: "Work Sans", Arial, Verdana, "Microsoft JhengHei", PMingLiU, sans-serif;
  letter-spacing: 0.1px
}
.storageBox li a > span {
  font-size: 1.1em;
  color: #000;
  font-weight: 700;
  letter-spacing: 0.1px;
  padding-left: 20px;
  display: block
}
.storageBox li a.current > span, .storageBox li a:hover > span, .storageBox li a:focus > span {
  color: #4998a9;
}
.storageBtn.cut > span::after {
  content: '';
  width: 12px;
  height: 12px;
  border-top: 1px solid #75dced;
  border-left: 1px solid #75dced;
  transform: rotate(225.00deg);
  position: absolute;
  right: 0;
  top: calc((100% - 15px)/2);
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
}
.storageBtn.cut.selt > span::after {
  -webkit-transform: rotate(75deg);
  transform: rotate(135deg);
}
@media screen and (max-width:853px) {
  aside {
    display: none
  }
  .leftMenu {
    display: none
  }
}
/*==========================================
內頁- select menu
===========================================*/
.AsideMenu {
  display: none;
}
.m_classLink {
  display: none;
}
.classBox {
  display: none
}
ul.classLink {
  padding: 5px 0;
  display: block;
  position: relative;
}
ul.classLink::before {
  content: '';
  width: 100%;
  height: 1px;
  background: #e4e4e4;
  position: absolute;
  top: 25px;
  left: 0;
}
ul.classLink li {
  display: inline-block;
  text-align: center;
  position: relative;
  padding: 5px 8px;
  margin-bottom: 5px;
}
ul.classLink li a {
  min-width: 130px;
  display: block;
  font-size: 0.938em;
  font-weight: 400;
  position: relative;
  padding: 0 15px;
  color: #01afb8;
  line-height: 35px;
  letter-spacing: 1px;
  background: #fff;
  border-radius: 18px;
  -webkit-box-shadow: 3px 3px #ddd;
  -moz-box-shadow: 3px 3px #ddd;
  box-shadow: 3px 3px #ddd;
  border: rgba(0, 0, 0, 0.2) solid 1px
}
ul.classLink li > dl {
  display: none;
  background: transparent;
  width: 130px;
  position: absolute;
  top: calc(100% + 0px);
  left: calc(50% - 65px);
}
ul.classLink li > a.currentPc {
  color: #fff;
  background: #01afb8;
}
.sideMenuList > dl dt {
  display: block;
}
.sideMenuList > dl a, .sideMenuList li a.current + dl a {
  display: block;
  margin: 0 0 5px;
  color: #f67e2a;
  letter-spacing: 0.5px;
  font-size: 0.875rem;
  border: 1px solid #e4e4e4;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}
.sideMenuList li > dl a:hover, .sideMenuList li a.current + dl a:hover, .sideMenuList li a.current + dl a.current {
  background: #fdd31f;
  text-decoration: none;
  color: #000
}
@media (max-width: 853px) {
  .classBox {
    display: block;
    width: 100%;
    max-width: 100%;
    padding: 20px 0;
    margin: 30px auto 0px auto;
    text-align: center;
    z-index: 99;
  }
  .m_classLink {
    z-index: 99;
    display: block;
    position: relative;
    cursor: pointer;
  }
  .m_classLink a.main b {
    font-weight: 400;
    display: block;
    color: #fff;
    z-index: 1;
    position: relative;
    text-align: center;
    cursor: pointer;
  }
  .m_classLink a.main i {
    display: block;
    font-size: 1.2em;
    position: absolute;
    right: 10px;
    top: 50%;
    cursor: pointer;
    margin-top: -15px;
  }
  .m_classLink a.main.open i {
    -webkit-transform: scaleY(-1);
    -ms-transform: scaleY(-1);
    transform: scaleY(-1);
    cursor: pointer
  }
  .fa-angle-down::before {
    font-style: normal;
    content: "+";
  }
  .m_classLink ul {
    padding: 0;
    list-style: none;
    display: none;
    width: 100%;
    border: 1px solid #d1d1d1;
    position: absolute;
    left: 0;
    top: 100%;
    z-index: 99;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  .m_classLink ul li {
    padding: 0;
  }
  .m_classLink ul li a {
    font-weight: 400;
    font-family: 'Noto Sans TC', sans-serif;
    letter-spacing: 2px;
    font-size: 1.063rem;
    position: relative;
    display: block;
    padding: 15px 10px;
    border-top: 1px solid #d1d1d1;
    color: #333;
    letter-spacing: 1px;
    background: #fff;
  }
}
.m_classLink ul li a:hover {
  color: #527dcf;
  background-color: #faf8ed;
}
.m_classLink ul li:first-child a {
  border: none;
}
.m_classLink dl dt a {
  padding-left: 20px;
}
.m_classLink .arrow::before {
  content: '+';
  position: absolute;
  right: 10px;
  top: 17px;
  color: #000;
  font-size: 1.2em;
  font-family: FontAwesome;
}
.m_classLink .arrow.open::before {
  -webkit-transform: scaleY(-1);
  -ms-transform: scaleY(-1);
  transform: scaleY(-1);
}
.classLink {
  display: none !important;
}

@media (min-width: 854px) {
  .classBox {
    display: none;
  }
}
@media (max-width: 853px) {
  .AsideMenu {
    display: block !important;
  }
  .Im_classLink {
    font-family: "Montserrat", Helvetica, Arial, "Noto Sans TW", "PingFang", "PingFangTC", "Microsoft JhengHei";
    display: block;
    position: relative;
  }
  .m_classLink a.main {
    border: 1px solid #426bba;
    box-shadow: 0 3px 4px rgb(0 0 0 / 10%);
    background-color: #e6f0f7;
    display: block;
    color: #2860ac;
    font-size: 1.1rem;
    letter-spacing: 1px;
    font-weight: 800;
    position: relative;
    padding: 10px 15px;
  }
  .m_classLink a.main :focus, .m_classLink a.main:hover {
    color: color: #008cd6
  }
  .m_classLink a.main b {
    font-weight: 400;
    display: block;
    color: #fff;
    z-index: 1;
    position: relative;
    text-align: center;
  }
  .m_classLink a.main i {
    display: block;
    font-size: 1.2em;
    position: absolute;
    right: 10px;
    top: 50%;
    margin-top: -15px;
  }
  .m_classLink a.main.open i {
    -webkit-transform: scaleY(-1);
    -ms-transform: scaleY(-1);
    transform: scaleY(-1);
  }
  .fa-angle-down::before {
    font-style: normal;
    content: "+";
  }
  .m_classLink ul {
    padding: 0;
    list-style: none;
    display: none;
    width: 100%;
    background: #FFF;
    border: 1px solid #d1d1d1;
    position: absolute;
    left: 0;
    top: 100%;
    z-index: 99;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  .m_classLink ul li {
    padding: 0;
  }
  .m_classLink ul li:first-child a {
    border: none;
  }
  .m_classLink dl dt a {
    padding-left: 20px;
  }
  .m_classLink .arrow::before {
    content: '+';
    position: absolute;
    right: 10px;
    top: 17px;
    color: #fff;
    font-size: 1.75rem;
    font-family: FontAwesome;
  }
  .m_classLink .arrow.open::before {
    -webkit-transform: scaleY(-1);
    -ms-transform: scaleY(-1);
    transform: scaleY(-1);
  }
  .m_classLink dl dt a {
    border-top: 1px solid #eee !important;
  }
  .Im_classLink dl dt a {
    border-top: 1px solid #eee !important;
  }
}



.infull {
  overflow: hidden;
  position: relative;
  width: 100%;
  max-width: 100%;
  height: 100%;
}

/*---------------------
    
    Pagernews Box
    
   --------------------------*/
.pageBox {
  padding:15px 15px;
  position: relative;
    max-width:100%;
    width: 100%;
    background-color: #FFF;
    border-radius: 8px;
    box-shadow:rgb(50 50 93 / 15%) 0px 2px 5px -1px, rgb(0 0 0 / 20%) 0px 1px 3px -1px;;
    -webkit-box-shadow: rgb(50 50 93 / 15%) 0px 2px 5px -1px, rgb(0 0 0 / 20%) 0px 1px 3px -1px;;
    -moz-box-shadow: rgb(50 50 93 / 15%) 0px 2px 5px -1px, rgb(0 0 0 / 20%) 0px 1px 3px -1px;;
    -ms-box-shadow: rgb(50 50 93 / 15%) 0px 2px 5px -1px, rgb(0 0 0 / 20%) 0px 1px 3px -1px;;
    margin:0px auto 0px auto;
    border: #eee solid 1px;display: block;
}

.news_cate {
  padding: 8px 16px;
  display: inline-block;
  border: 1px solid #E4E8EE;
  border-radius: 20px;
  line-height: 1;
  font-weight: 700;
  font-size: 14px;
  color: #005DB0;
  margin:10px auto 0 18px 
}
.detail_header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin: 0 0 10px;
  padding: 15px;
  border-bottom: 1px dashed #cfcfcf;
}
.detail_headerTit {
  font-family: "Microsoft JhengHei", CenturyGothic, sans-serif;
  font-size: 1.375rem;
  margin: 0;
  width: 100%;
  padding:5px 10px;
  line-height:30px;
  letter-spacing: 2px
}



.TxtEditor {
  line-height:2;
  font-size: 17px;
  text-align: justify;
  color: #282828;
  width: 100%;
  position: relative;
  display: block;
  padding: 15px;
  word-wrap: break-word;
  word-break: break-all;
  margin: 15px auto 15px auto;
  clear: both;
}




/*----sub tit Green----*/

  .TxtEditorCBox {
    position: relative;  
    background-color:#deeee3;
    padding:6px 15px;
    margin:0 auto 20px 8px;  
      max-width: fit-content;
      border-radius:5px;    
}
/*----sub tit Gary-----*/
.Date_topBox {
  position: relative;  
  border-radius: 5px;
  padding:10px;

    max-width: fit-content;
    float: left;

}

.Date_top {
  font-size: 1rem;
  color: #383838;
  text-align:left;
  position: relative;
  padding-left:16px;
  line-height: 1.5; 
   background: #e8eef2;
  letter-spacing: 1px;
    font-weight: bold;
    padding:6px 20px 6px 30px;
    display: inline-block;
}


.Date_top::before {
  position: absolute;  
   width:8px;
    height: 8px;
    content: "";
    top:13px;
      left:10px;
    background: #f08300;
    border-radius: 50%;
    display: block;
}



.TxtEditor ._imgBox{
   position: relative;
  margin:60px auto 15px auto ;
  display: flex;
  flex-wrap: wrap ;
  justify-content: center;
  align-items: stretch;   
   max-width:100%;
   width:100%;
}


.TxtEditor ._img {
  padding: 0;
  margin: 0 2% 5% 0;
  max-width:30%;
  min-width:30%;
  height: auto;
  background: #ECECEC;
  overflow: hidden;
  box-shadow: 0 3px 10px rgba(0,0,0,0.1);
   display: inline-flex
  
  } 


    .TxtEditor  ._img img {
      display: block;
      cursor: pointer;
      object-fit: cover;
      max-width: 100%;
      width: 100%;
      -webkit-transition: -webkit-transform 0.4s ease;
      transition: -webkit-transform 0.4s ease;
      transition: transform 0.4s ease;
      transition: transform 0.4s ease, -webkit-transform 0.4s ease;
  }


  .TxtEditor  ._img img:hover {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
}

/*-----------
 dowld 

---------*/
        


.fileBox {
    padding: 5px 0;
    margin: 40px auto 0px auto;
    border-radius: 5px;
    background: #F2F5F8;
    color: #064048;
    bottom: 30px;
    display: block;
    max-width: 90%;
    width: 90%;
}


.fileBox_buy {
  padding: 5px 0;
  margin:px auto 15px auto;
  border-radius: 5px;
  color: #064048;
  display: block;
  max-width: 100%;
  width: 100%;
}


.fileBox_buy .dm{   
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      display:block;
    
}

.fileBox_buy .dm ul{  
  width: 100%; 
  max-width: 100%;
  display: flex;   
  justify-content: center; 
   -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding:0}


  .fileBox_buy .dm ul li{   
    display: inline-block;
    padding:8px}

    .fileBox_buy .dm ul li .Img{   
      max-width:280px;
      min-width: 280px;
      height:280px; 
      margin: 0 auto;
      position: relative;
      overflow: hidden;
      padding: 0;
      background-color:transparent;
      outline: 0;
      vertical-align:middle;
      text-align: center;
    
    }
  
  .fileBox h4 {
    color: #0E5DA8;
        padding: 10px;
        font-size: 15px;
        font-weight: 500;
        border-bottom: solid #ccc 2px;
    }


    .fileBox_buy h4{
      color: #2c3e50;
      padding: 10px;
      text-align: center;
      font-size:22px;
      font-weight: 500;
      border-bottom: solid #ccc 2px
    }
        .fileBox h4:before {
        background: #ffd900;
            content: "";
            height: 100%;
            width: 3px;
            left: 0;
            position: absolute;
            top: 0;
        }
.filest {
    display: block;
    padding: 10px 8px;
    text-align: left;
    letter-spacing: 0.03em;
color: #1D2B3B;
    font-size: 15px;
}

.filename {
    position: relative;
    margin: 0 auto;
    clear: both;
}

    .filename ul {
        margin: 0;
        padding: 0;
        list-style: none;
        line-height: 150%;
    }

    .filename li {
        word-wrap: break-word;
        word-break: break-all;
        margin: 0 0 8px;
        padding: 5px 10px;
        border-bottom: 1px dotted #ccc4a8;
    }


    .filename li ._img{
      top: 0px;
      border: 1px solid #ccc;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      display:inline-block;
      max-width: 100px;
      min-width: 100px;
      height: 100px;
      margin: 0 10px 0px 0;
      position: relative;
      overflow: hidden;
      padding: 0;
      background-color:transparent;
      outline: 0;
      vertical-align:middle;
  } 
 
  .filename li ._img img {
    border: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.3s linear;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.attachment .filename li span {
    margin-left: 8px;
}

.filename li a {
    color: #666;
    text-decoration: none;
}

    .filename li a:hover {
        text-decoration: none;
        color: #3e6793;
     
    }


.filename .fileSize {
    margin: 0 5px;
    color: #999;
    padding: 0;
    font-size: 13px
}
@media screen and (max-width:1024px) {

.fileBox_buy .dm {
  height: 300px;
  overflow-y: scroll;
}
.fileBox_buy .dm ul li .Img{height: auto;}
}


/*-----------------
	table
----------------*/
.muTable {
	width: 100%;
	max-width: 100%;
	padding: 15px 10px;
	background-color: #fff;
	border-collapse: collapse;
	border-spacing: 0;
	display: table;
	position: relative;
	font-style: normal;
	font-family: 'Microsoft JhengHei', 'Heiti TC', 'Microsoft JhengHei', 'Arial Black', 'LiHei Pro';
	margin: 15px auto ;
	border: #ccc solid 1px;
  -webkit-overflow-scrolling: touch;
}

		/*---列表第1列----*/
	.muTable thead {
		background-color: #fcd7b2;
		font-weight: bold;
		padding: 15px 10px;
		text-align: center;
		vertical-align: bottom;
		font-family: 'Microsoft JhengHei', 'Heiti TC', 'Microsoft JhengHei', 'Arial Black', 'LiHei Pro';
	}

		.muTable thead th {
			vertical-align: bottom;
			padding: 15px;
			font-size: 1.063rem;
			font-weight: 700;
			text-align: center;
			display: table-cell;
			letter-spacing: 1px
		}

		.muTable tr {
			border: none;
			width: 100%;
			max-width: 100%;
			display: table-row;
		}

	.muTable th, .muTable td {
		font-size: 1rem;
		line-height: 1.5;
		padding: 8px 12px;
		border: 1px solid #ccc;
		display: table-cell;
		vertical-align: middle;
	
	}

.muTable td:first-child{
  font-weight: bold;
      min-width: 110px;
  letter-spacing: 1px;
  text-align: center;}

/*------會議---*/
.rwd-table thead {
    background-color: #eeeef1;
    font-size: 1.125em;
    color: #000;
    font-weight: 400;
    text-align: center;
    flex-shrink: 0;
    letter-spacing: 1px;
}

.rwd-table tr:nth-of-type(2n) {
     background: #e5edf4;
}
.rwd-table tr td{
  color:#000
}

	@media screen and (max-width:1180px) {
		.muTable {
			max-width: 100%;
			width: 100%;
			margin: auto;
	
      overflow-x: scroll;
      
     
		}
		
				.muTable td {
		
				display: table-cell;
				vertical-align: middle;
			}

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

		.muTable td:nth-child(odd) {
			text-align: center;
			vertical-align: baseline;
			vertical-align: bottom;
		}

  
  .muTable thead th {
     display: block;
  }
		.muTable tr {
			line-height: 1.8em;
			display: block;
			width: 100%;
		}


		.muTable tbody > tr > td {
			cursor: pointer;
			padding: 10px 10px;
			text-align: left;
			display: block;
			width: 100%;
			max-width: 100%;
		}


		.tableSpanTxt {
			text-align: center;
		}

		.muTable td:first-child {
      border-top: none;
      border-bottom: none;
      min-width: 100%;
      background: #eef1f5}

  
	
  }

/*-----------
social icon 

---------*/

.share {
	float: right;
	position: relative;
  margin-right:15px;
  margin-left:auto;
  margin-bottom: 5px;
	display:block;
  top:10px;
}

.social {
	position: absolute;
	top: 0;
	right: 0;
  bottom: 0px;
	visibility: hidden;
	min-width: 170px;
  width: 170px;
	transform: translateZ(0);
  	transform: translateX(0px);
  	transition: transform 0.35s ease;
    justify-content: flex-end;
    display: flex;
   
}
	.social--active {
		visibility: visible;
		transform: translateZ(0);
 		transform: translateX(-48px);
  		transition: transform 0.35s ease;
	}

  .share-svg-icon-share {
    position:absolute;
    fill: #666;
    stroke-width: 0.2px;
    FONT-WEIGHT: 200;
    width: 24px;
    height: 24px;
    color: #666;
    margin:0px auto 0 0;
    top: 6px;
    right:8px;
  }
  
.share-icon {
	display: inline-block;
  margin-left:5px;
	width: 38px;
	height: 38px;

	text-align: center;
	border-radius: 50%;
	background-color: #fff !important;
	transition: all 0.3s ease;
	outline: 0;
	box-shadow: 
	  		0 2px 4px rgba(0,0,0, 0.12),
	    	0 2px 4px rgba(0,0,0, 0.24);
}
	.share-icon:hover{
    background-color: #e0d800!important;
	    -webkit-transform: scale(1.1);
	    -moz-transform: scale(1.1);
	    -ms-transform: scale(1.1);
	    -o-transform: scale(1.1);
	    transform: scale(1.1);
       fill: #fff!important;
       color: #fff!important;
	}
  .share-svg-icon-share:hover{  
    fill: #fff;
    color: #fff;
   
  }
.facebook {
  z-index: 1;
	background-color: #3b5998!important
}
.igplus { z-index: 1;
  background-image: linear-gradient(to top, #3f51b1 0%, #5a55ae 13%, #7b5fac 25%, #8f6aae 38%, #a86aa4 50%, #cc6b8e 62%, #f18271 75%, #f3a469 87%, #f7c978 100%)!important;}

.lineplus { z-index: 1;
	background-color: #03bd02!important
}


.linkshare { z-index: 1;
	background-color:#ff7f40!important; 
 
}
.share-svg-icon-fb { 
  z-index: 1;
  position: relative;
  fill: #fff;
  stroke-width: 0.2px;
  FONT-WEIGHT: 200;
  width: 25px;
  height: 25px;
  color: #fff;
  margin-bottom: 2px;
  margin: 7px auto 0 0;
}


.share-svg-icon-line { 
  z-index: 1;
  position: relative;
  fill: #fff;
  stroke-width: 0.2px;
  FONT-WEIGHT: 200;
  width: 29px;
  height: 29px;
  color: #fff;
  margin:5px auto 5px 2px;
}
.share-svg-icon-tracks{
   z-index: 1;
  position: relative;
  fill: #fff;
  stroke-width: 0.2px;
  FONT-WEIGHT: 200;
  width: 29px;
  height: 29px;
  color: #fff;
  display: block;
  margin:5px auto 5px 4px;
}


.share-svg-icon-ig {
   z-index: 1;
  position: relative;
  fill: #fff;
  stroke-width: 0.1px;
  stroke: #fff;
  width: 38px;
  height: 38px;
  color: #fff;
}



/*-----Service 內頁TIT----------------*/
.p-service__tit {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 0 20px;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  background: #f8f8ff;
  overflow: hidden;
  border: solid #fff 5px;
  box-shadow: 0 1px 3px rgb(0 0 0 / 15%);
}
.p-service {
  position: relative;
  width: 100%;
  max-width: 100%;
  padding: 15px;
  color: #222;
  margin: 0 auto;
}
.p-service_single_kv__ttl {
  font-size: 32px;
  line-height: 1.2;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  white-space: nowrap;
  color: #666;
}
.p-service__number {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.p-service__number .number {
  font-family: "URWDIN-Demi", sans-serif;
  -webkit-transform: translateY(0.2em);
  transform: translateY(0.2em);
  font-size: 78px;
  color: #a2baff;
}
.p-service__number .en {
  font-family: "Poppins", Arial, sans-serif;
  -webkit-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  font-size: 24px;
  top: 0;
  color: rgb(155, 169, 187);
  margin-top: 10px;
  margin-right: 15px;
  font-style: normal
}
.p-service__ttl {
  font-size: 36px;
  line-height: 2;
  margin-top: 10px;
  white-space: nowrap;
  color: rgb(68, 68, 68);
  letter-spacing: 5px;
}
.p-service__txt {
  font-weight: 700;
  line-height: 2;
  margin-bottom: 0;
  font-size: 18px;
  color: #666
}
.decoration {
  background: linear-gradient(135deg, #ffb2e4, #82d5ff);
  border-radius: 15px;
  position: absolute;
  -webkit-transform: rotate(-30deg);
  transform: rotate(-30deg);
}
.decoration:nth-of-type(1) {
  bottom: 110px;
  right: -35px;
  width: 170px;
  height: 80px;
}
.decoration:nth-of-type(2) {
  bottom: 0px;
  right: -40px;
  width: 180px;
  height: 80px;
}
/*---沒有底圖的tit----*/
.p-case__ttl {
  font-size: 32px;
  line-height: 2;
  white-space: nowrap;
  color: rgb(68, 68, 68);
  letter-spacing: 5px;
}



@media only screen and (max-width: 1280px) {
  .TxtEditor ._img {
    margin: 0 2% 5% 0;
    max-width:48%;
    min-width:48%;
    } 

  }


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

  .share {top: 0;}

  .Date_topBox{
   background-color: transparent;
    width: 100%;
    max-width: 100%;
    position: relative; 
    display:block;

  }
  .TxtEditor ._img {
    margin: 0 2% 5% 0;
    max-width:95%;
    min-width:95%;
    height: auto;
     display: inline-flex  
    } 

  
}
/*------圓型按鈕-------*/
.page_naviation_circle {
  clear: both;
  position: absolute;
  top: 100%;
  width: 85px;
  height: 85px;
  right: 0%;
  border-radius: 50%;
}
/*------圓型按鈕 絕對路徑S\-------*/
.Rpage_naviation_circle {
  text-align: center !important;
  position: relative;
  margin: auto !important;
  right: auto !important;
}
.page_naviation_circle:before {
  width: 85px;
  height: 85px;
  background-size: 100%;
  background-color: #fff;
  left: 0%;
  top: 0;
  content: "";
  position: absolute;
  border: 0.05rem solid #fff;
  border-radius: 50%;
  transition: .5s cubic-bezier(.19, 1, .22, 1);
  overflow: hidden;
  cursor: pointer
}
.page_naviation_circle:hover:before {
  background-color: #4a7aec;
  border-radius: 50%;
  border: none;
  color: #fff;
  transform: scale(1.7)
}
.page_naviation_circle span {
  color: #4a7aec;
  line-height: 2;
  position: relative;
  padding: 5px 7px 0 10px;
  font-weight: 600;
  font-family: "Trebuchet MS", 'Open Sans', Arial, '微軟正黑體', sans-serif;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  letter-spacing: 0.25px;
  z-index: 3;
  width: 100%;
  height: 100%
}
.Rpage_naviation_circle span {
  padding: 5px 20px 0 20px;
}
a.page_naviation_circle:visited:before {
  color: #ffffff;
}
a.page_naviation_circle:active :before {
  color: #ffffff;
}
a.page_naviation_circle:link :before {
  color: #ffffff;
}
.page_naviation_circle span:link {
  color: #ffffff;
  text-decoration: none
}
.page_naviation_circle span:visited {
  color: #ffffff;
  text-decoration: none
}
.page_naviation_circle span:hover {
  color: #ffffff;
}
.page_naviation_circle span:active {
  color: #ffffff;
}
/* TIMELINE
–––––––––––––––––––––––––––––––––––––––––––––––––– */
#ServiceStepTit{
	flex-direction: row;
	justify-content: flex-start;
	display: flex;
	flex: initial;
    position: relative;
	justify-content: center;
	align-content: center;
	max-width:100%;
    width:100%;
	padding:60px 30px
}
#ServiceStep {
  color: #fff;
  font-weight: 400;
  position: relative;
  line-height: 1.5;
  font-size: 2.6rem;
  font-family: 'Noto Sans TC', sans-serif;
  padding: 12px 15px;
}

/*------20220826----*/
.timelineBox {
  display:block;
  padding:200px 40px 90px 40px;
  justify-content:center;
  align-items: center;
}

.timeline {
  white-space: nowrap;

    width: 100%;
    max-width: 1000%;
    overflow: hidden;
}

.timeline ol {
  font-size: 0;
  margin: 0;
  padding: 0;
  transition: all 1s;
}
.timeline ol li {
  position: relative;
  display: inline-block;
  list-style-type: none;
  width: 150px;
  height: 3px;
  background: #fff;
}

.timeline ol li:not(:first-child) {
  margin-left: 13px;
}

.timeline ol li:last-child {
  margin-right: auto; 
  margin-left:0px !important;   
   right: 15px !important;
}
	   

.timeline ol li:not(:last-child)::after {
  content: '';
  position: absolute;
  top: 50%;
  left: calc(100% + 1px);
  bottom: 0;
  width: 12px;
  height: 12px;
  z-index:2;
  transform: translateY(-50%);
  border-radius: 50%;
  background: #F45B69;
}
.timeline ol li div {
  position: absolute;
  left: calc(100% + 7px);
  width: 280px;
  font-size: 1rem;
	padding:30px 15px 15px;
  white-space: normal;
  color: black;
  background: #FFF;
  min-height: 210px;
  max-height: 210px;
  border: #eee solid 1px;
	
}
.timeline ol li .stTxt {
    color: #383838;
    min-height: 150px;
    max-width: 100%;
    margin: 0 auto 0 auto;
    display: block; 
    overflow: hidden;  
    position: relative;
}

.timeline ol li div::before {
  content: '';
  position: absolute;
  top: 100%;
  left: 0;
  width: 0;
  height: 0;
  border-style: solid;
}
.timeline ol li:nth-child(odd) div {
  top: -20px;
  transform: translateY(-100%);
	left: 20px	
}

.timeline ol li div::before {
  top: 100%;
  border-width: 10px 10px 0 0;
  left: -1px;
  border-color: white transparent transparent transparent;
}
.timeline ol li:nth-child(even) div {
  top: calc(100% + 16px);
}
.timeline ol li:nth-child(even) div::before {
  top: -8px;
  border-width: 8px 0 0 8px;
  border-color: transparent transparent transparent white;
}
.timeline .st {
  display: block;
  font-size: 1.4rem;
  color: #039e8e;
  margin-bottom: 8px;
  text-align: center
}
/* TIMELINE ARROWS
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.timeline .arrows {
  display: flex;
  justify-content: center;
	border: none;
	margin:280px auto 0 auto
}
.timeline .arrows .arrow__prev,.timeline .arrows .arrow__next{
  margin-right: 20px;   
	position: relative;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    font-size: 12px;
    font-weight: bold;
    color: #0071BC;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    background: #fff;
    text-decoration: none;
    transition: .3s;
	z-index: 2;
	border: none;
}



.timeline .disabled {
  opacity: 1;
}


.timeline .pre_arrow {
    cursor: pointer;
    position: absolute;
    bottom: 0;
    margin: auto;
    background-color:transparent;
    left: 15px;
    top: 15px;
    width: 30px;
    height: 30px;
    z-index: 2;
}
.timeline .next_arrow {
    cursor: pointer;
    position: absolute;
    bottom: 0;
    margin: auto;
    background-color:transparent;
    right: 15px;
    top: 15px;
    width: 30px;
    height: 30px;
    z-index: 2;
}

.timeline .pre_arrow:before {
    position: absolute;
    content: "";
    top: 0px;
   left: 0px;
    width: 15px;
    height: 15px;
    border-top: 2px solid #2860ac;
    border-right: 2px solid #2860ac;
    transform: rotate(225deg);
}

.timeline .next_arrow:before {
    position: absolute;
    content: "";
    top: 0px;
   right: 0px;
    width: 15px;
    height: 15px;
    border-top: 2px solid #2860ac;
    border-right: 2px solid #2860ac;
    transform: rotate(45deg);
}
/*-----------------------------------------------------


GENERAL MEDIA QUERIES
---------------------------------------------------- */

  .timelineBox{ overflow-x: scroll;}



@media screen and (max-width: 599px) {
    .timelineBox {
  display: block;
	padding:15px 0 60px 0;}
	
  .timeline ol, .timeline ol li {
    width: auto;
  }
  .timeline ol {
    padding: 0;
    transform: none !important;
  }
  .timeline ol li {
    display: block;
    height: auto;
    background: transparent;
  }
  .timeline ol li:first-child {
    margin-top: 25px;
  }
  .timeline ol li:not(:first-child) {
    margin-left: auto;
  }
  .timeline ol li div {
    width: 94%;   
	  min-height: 1px;
    height: auto !important;  
	  padding:30px 15px;
    margin: 0 auto 25px;
  }

.timeline ol li .stTxt {
	min-height: auto
	}
	
  .timeline ol li div {
    position: static;
  }
  .timeline ol li:nth-child(odd) div {
    transform: none;
  }
  .timeline ol li:nth-child(odd) div::before, .timeline ol li:nth-child(even) div::before {
    left: 50%;
    top: 100%;
    transform: translateX(-50%);
    border: none;
    border-left: 1px solid white;
    height: 25px;
  }
 .timeline ol li:nth-last-child(2) div::before, .timeline ol li:not(:last-child)::after, .timeline .arrows {
    display: none;
  }
  .timeline ol li:last-child div::before{
    display: none;
  }
  .timeline ol li:last-child {
    margin-right: auto; 
    margin-left:auto !important;   
     right: 0 !important;
  }
  .timelineBox {
    overflow-x:hidden}
}

/*-----------------------------------------------------

News
---------------------------------------------------- */



/*------tab--------*/

.c-tab-list{
	    display: flex; 
    margin:20px  auto;
      justify-content: center;
    align-items: center; 
}

.c-tab-list-item{
	border-right:solid 1px #e8eaf1;
	padding:0 8px;
}

.c-tab-list .c-tab-list-item:first-child{
	border-left:solid 1px #e8eaf1;
}

.c-tab-list-item-link{
	display:inline-block;
	min-width:194px;
	padding:0 32px;
	background:#ffffff;
	border-radius:3px;
	font-size:1.2rem;
	line-height:1.5;
	font-weight:600;
}

.c-tab-list-item-link.is-act{
	background:#fdebcc;
	color:#f7941d
}

.c-tab-list-item-link-block{
	display:table;
	width:100%;
	height:48px;
}

.c-tab-list-item-link-block-inner{
	display:table-cell;
	vertical-align:middle;
	text-align:center;
}

.c-tab-list-item-link.is-act .c-txt-link-line{
	background:none ! important;
}

.c-tab-cts{
	margin:40px auto 20px  auto;
  max-width: 100%;
  width: 100%;
}

.c-tab-cts-block{
	display:none;
}

.c-tab-cts-block.is-act{
	display:block;
}

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

	.c-tab-list{
		display:flex;
		flex-wrap:wrap;
	}

	.c-tab-list-item{
		width:50%;
		border-right:solid 1px #e8eaf1;
		padding:0 8px;
	}

	.c-tab-list > .c-tab-list-item:nth-of-type(2n+1){
		border-left:solid 1px #e8eaf1;
	}

	.c-tab-list > .c-tab-list-item:nth-of-type(n+3){
		margin-top:16px;
	}

	.c-tab-list-item-link{
		display:block;
		width:100%;
		min-width:initial;
		height:100%;
		padding:0 8px;
	}

	.c-tab-list-item-link-block{
		width:100%;
		height:100%;
	}

	.c-tab-list-item-link-block-inner{
		min-height:40px;
		padding:8px 0;
		text-align:center;
	}

	.c-tab-cts{
		margin-top:32px;
	}
  .c-tab-list-item-link {
    display: inline-block;
    min-width: 194px;
    padding: 0 20px;

}

}

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


  .c-tab-list-item {
    width: 33%;
    max-width: 33%;
  }

  .c-tab-list>.c-tab-list-item:nth-of-type(n+3) {
    margin-top: 0px;
  }
  .c-tab-list-item-link {
    padding: 0 5px;}
    .c-tab-list-item-link {
      min-width: auto;
    }
}

@media only screen and (max-width:414px) {
.c-tab-list-item-link{
  padding:0;
  letter-spacing: -1px;
  font-size: 1.1rem}
}


/*--------------------------------------------------------------------------------
 share 
--------------------------------------------------------------------------------*/

.slist_sec{
  display: flex;
  width: 100%;
  max-width: 100%;
  position: relative;
  overflow: hidden;
  margin: 30px auto 30px auto;
  padding: 15px;   
   justify-content:center;
}

.slist {
  margin-top: -45px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
      padding: 0;
      margin: 0;
  list-style: none;
  list-style-type: none;
}
.slist li {
  overflow: hidden;

      display: block;
      display: inline-block;
  padding: 0;
  margin: 0 15px 25px 0;
  width: 31%;
  max-width: 31%;

}

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

	.slist li  {
		flex: 0 0 47%;
		max-width: 47%;
		margin-right: 10px;
	}
}
@media screen and (max-width:640px) {

	.slist li  {
		flex: 0 0 98%;
		max-width: 98%;
		
	}
}
/*--------------------------------------------------------------------------------
	/contacts/common
--------------------------------------------------------------------------------*/

.p-contacts-common-table{
	width:100%;
	font-size:1.6rem;
	line-height:1.8;
	border-collapse:collapse;
	border-spacing:0;
}

.p-contacts-common-table > tbody > tr > th{
	width:34.4167%;
	font-weight:normal;
	vertical-align:top;
	text-align:right;
	padding:32px 15px;
	border-top:solid 1px #E8EAF1;
}

.p-contacts-common-table > tbody > tr > td{
	width:65.5833%;
	vertical-align:top;
	text-align:left;
	padding:32px 0;
	border-top:solid 1px #E8EAF1;
}

.p-contacts-common-table > tbody > tr:nth-of-type(1) > th,
.p-contacts-common-table > tbody > tr:nth-of-type(1) > td{

	border-top:none;
}


.p-contacts-common-table > tbody > tr:last-child > td{
	padding:32px 0 0 0;
}

.p-contacts-common-table-th-ttl{
	font-size:1.2rem;
	line-height:1.5;
	font-weight:800;
}

.p-contacts-common-table-th-txt{
	display:block;
	margin-top:12px;
	font-size:1.2rem;
	line-height:1.8;
}





/* form */


.p-contacts-common-table .c-list-01 > li:before {
	background:#222222;
}

.p-contacts-common-table .c-list-01 > li:last-child {
	margin-bottom:0;
}


.p-contacts-common-form-pref-wrapper{
	margin-bottom:30px;
}

.p-contacts-common-form-pref{
	width:300px;
	margin-bottom:0;
}

	.p-contacts-common-form-pref-wrapper{
		margin-bottom:24px;
	}
  .c-form-textarea{margin-bottom:6px;}


.form-txt-line{

   display: inline-block;
  margin-right: 5px;
  margin-left: 5px;
}


.p-contacts-common-icon-required {
  display: inline-block;
  width: 80px; 
  margin-left: 8px;
  margin-right: 8px;
  border: solid 1px #e70012;
  border-radius: 30px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #e70012;
  text-align: center;
  transform: translateY(-2px);
}

.required {
  display: inline-block; 
  margin-left: 8px;
  margin-right: 8px;
  font-size: 1.5rem;
  font-weight: 500;
  color: #e70012;
  text-align: center;
  transform: translateY(-2px);
}
/* form - override */

.c-form-textarea {
  width: 100%;
  padding: 9px 12px;
  background: #F5F6F8;
  border: solid 1px #E8EAF1;
  border-radius: 4px;
  font-size: 1rem;
  line-height: 1.8;
 }
 .c-form-textarea::placeholder{
	color:#777;
}

.c-form-textarea:focus{
	border:solid 1px #527DCF;
	outline:0;
}

.c-form-textarea-wrapper.c-form-textarea-wrapper--valid .c-form-textarea{
	background:#E8F1FF;
	border:solid 1px #E8F1FF;
}

.c-form-textarea-wrapper.c-form-textarea-wrapper--error .c-form-textarea{
	background:#FFECED;
	border:solid 1px #E70012;
}

.c-form-textarea-wrapper .c-form-textarea-errtxt{
	display:none;
}

.c-form-textarea-wrapper.c-form-textarea-wrapper--error .c-form-textarea-errtxt{
	display:block;
	font-size:1rem;
	line-height:1.5;
	color:#E70012;
	margin-top:8px;
}


.form-w100{width: 100px;max-width: 100px;}
.form-w150{width: 150PX;max-width: 150px;}

.form-ps{  
   display: block;
    font-size: 1rem;
    line-height: 1.5;
    padding: 20px;
    margin: auto;
    background: #fff2dd;
}

  /*------- check -------*/

.container-checkbox {

  cursor: pointer;
  max-width: 100%;
  margin: 0px auto 0 auto;
  clear: both;
  font-size: 1.1rem;
  line-height: 1.5;
  position: relative;
 display: inline-block;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.container-checkbox .checkTxt{
  padding-left: 40px; 
  display: inline-block;
  padding-top: 6px;
}
/* Hide the browser's default checkbox */
.container-checkbox input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}

/* Create a custom checkbox */
.container-checkbox .checkmark {
  position: absolute;
  top: 7px;
  left: 0;
  height: 25px;
  width: 25px;
  display: inline-block;
  background-color: #eee;
}

/* On mouse-over, add a grey background color */
.container-checkbox:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
    .container-checkbox input:checked ~ .checkmark {
        background-color: #527dcf
    }

/* Create the checkmark/indicator (hidden when not checked) */
.container-checkbox .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.container-checkbox input:checked ~ .checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.container-checkbox .checkmark:after {
  left: 9px;
  top: 0px;
  width: 10px;
  height: 18px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}



.form-row {
  display: block;
  line-height: 1.5;
  margin: 20px auto;
  justify-content: center;
  max-width: 100%;
  width: 100%;
text-align: center;

}

.c-form-textarea-wrapper {
    display:block;
}
.form-check-picbox {
      align-items: center;
    display: flex;
    max-width: 100%;
    width: 100%;
    padding-left: 10px;
    justify-content: flex-start;
    flex-direction: row;
}


.numcheck-input {
    padding: 9px 12px;
    background: #F5F6F8;
    border: solid 1px #E8EAF1;
    border-radius: 4px;
    font-size: 1rem;
    line-height: 1.8;
    width: 160px;
    max-width: 160px;
    flex: 0 0 160px;
    margin-bottom: 6px;
}
    .numcheck-input:focus {
        border: solid 1px #527DCF;
        outline: 0;
    }



.cap_num {
    height: 50px;
    width: 150px;
    max-width: 150px;
    flex: 0 0 150px;
    background: #e0e0e0;
    color: #5f5f5f;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.refresh {
    position: relative;
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
    background: #9c9c9c;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0px 8px 0 8px;
    text-align: center;
    cursor:pointer
}

.refresh img{
  position: absolute;
  top: 15px;
  left: 15px;
  max-width:auto;
   width: auto;
  }

@media only screen and (max-width: 811px) {
    .p-contacts-common-table {
        display: block;
        font-size: 1.1rem;
        line-height: 1.8;
    }

        .p-contacts-common-table > tbody {
            display: block;
            width: 100%;
        }

            .p-contacts-common-table > tbody > tr {
                display: block;
                width: 100%;
            }

                .p-contacts-common-table > tbody > tr > th {
                    display: block;
                    width: 100%;
                    padding: 24px 0;
                    text-align: left;
                    border-top: solid 1px #E8EAF1;
                }

                .p-contacts-common-table > tbody > tr:nth-of-type(1) > th {
                    border-top: 0;
                    padding: 0 0 24px 0;
                }

                .p-contacts-common-table > tbody > tr:last-child > th {
                    padding: 20px 0;
                }

                .p-contacts-common-table > tbody > tr > td {
                    display: block;
                    width: 100%;
                    border-top: 0;
                    padding: 0 0 24px 0;
                }

                .p-contacts-common-table > tbody > tr:nth-of-type(1) > td {
                    padding: 0 0 24px 0;
                }


                .p-contacts-common-table > tbody > tr:last-child > td {
                    padding: 0 0 0 0;
                }

    .p-contacts-common-table-th-ttl {
        font-size: 1.2rem;
        line-height: 1.5;
        font-weight: 800;
    }

    .p-contacts-common-table-th-txt {
        display: block;
        margin-top: 6px;
        font-size: 1.0rem;
        line-height: 1.8;
    }

    .form-w100 {
        width: 80px;
    }

    .form-w150 {
        width: 100px;
    }

    .form-check-picbox {
        display:table;
       padding:0
    }
    .numcheck-input {
        float: left
    }
        .refresh {
        display: inline-block;
        float: left;
        margin-bottom: 5px
    }

    .cap_num {
        display: inline-block;
        float: left;
        margin-bottom: 5px
    }
}