.ban_online {
   background: url(gf_online_bg01.jpg) no-repeat center top;
   height: 400px;
   margin-bottom: 30px;
}

.pageIndex .main_part{border: none;min-height: auto;}
.main_part{max-width: 100%;width: 100%;padding: var(--padY) 0;}
.show_content{width: 90%;padding: 0;}

#content {
   background-color: #FBFAF9;
}

/*統一設定*/
.all * {box-sizing:border-box; max-width:100%;word-break: normal;}
.all {
   max-width: 2000px;
   width:100%;
   margin: 0 auto;
   overflow:hidden;
   font-family: var(--fm-serif);
   font-size: var(--f18);
}
.all img{width:auto; max-width:100%;vertical-align: middle;}
.all a{text-decoration:none;color: inherit;transition: .5s ease;}

.all li{list-style:none;}
.all ol{padding: 0;}
.all h6,.all h5,.all h4,.all h3,.all h2,.all figure,.all p{margin: 0;}
.all section{overflow: initial;}
/* .animated15 { animation: none;} */


/* all style */
.title_A{
   font-family: var(--fm_playfair);
   font-weight: 400;
   font-size: var(--f40);
   color: var(--color_B);
   letter-spacing: 0.05em;
   line-height: 1;
}
.title_B{
   font-family: var(--fm_serif);
   font-weight: 400;
   font-size: var(--f28);
   color: var(--color_B);
   letter-spacing: 0.05em;
   line-height: 1;
}
.text_A{
   display: block;
   font-family: var(--fm_serif);
   font-size: var(--f18);
   letter-spacing: 0.05em;
   line-height: 180%;
   color: var(--color_B);
}
.text_B{
   display: block;
   font-family: var(--fm_playfair);
   font-size: var(--f17);
   line-height: 200%;
   color: var(--color_B);
}
a.button_A{
   display: flex;
   align-items: center;
   justify-content: space-between;
   max-width: 200px;
   border-bottom: 1px solid var(--color_B);
   position: relative;
}
a.button_A span{
   display: block;
   width: calc(100% - 40px);
   padding: 0 10px;
   font-family: var(--fm_serif);
   letter-spacing: 0.05em;
   position: relative;
   z-index: 2;
   transition: .5s ease;
}
a.button_A:hover span{
   transform: translateX(60px);
}
a.button_A i{
   display: flex;
   align-items: center;
   justify-content: center;
   max-width: 40px;
   width: 100%;
   min-height: 40px;
   border: 1px solid var(--color_B);
   margin-bottom: -1px;
   transition: .5s ease;
}
a.button_A:hover i{
   background: var(--color_B);
}
a.button_A:hover i img{
   filter: brightness(20);
}
@media screen and (max-width:1024px) {
}

/*notice*/
.online_notice{
}
.online_notice section{
   max-width: 1200px;
   margin: 0 auto;
   padding: 80px 50px;
   background: var(--color_A);
}
.online_notice h6{
   text-align: center;
}
.online_notice h5{
   padding-top: 10px;
   text-align: center;
}
.online_notice p{
   border-bottom: 2px dotted #777777;
   padding: 30px 0;
}
.online_notice span{
   padding: 20px 0 40px;
}
.online_notice a{
   margin: 0 auto;
}
.online_border{
   max-width: 1200px;
   border-bottom: 2px dotted #777777;
   margin: 50px auto;
}

@media screen and (max-width:768px) {
.online_notice section{padding: var(--padY) 20px;}
}

/* tab&from */

.online_box {
   max-width: 1200px;
   margin: 0 auto;
}

.online_box .box_le {
   display: block;
   vertical-align: top;
   width: 100%;
}

.box_le blockquote {
   margin-bottom: 50px;
}

.box_le h4 {
   font-size: 35px;
   color: #926E2F;
   font-weight: 400;
   margin-bottom: 20px;
}

.box_le em {
   font-size: 18px;
   color: #000;
   font-style: normal;
   display: block;
}

.box_le h6 {
   font-size: 20px;
   color: #fff;
   font-weight: 600;
   display: inline-block;
   padding: 7px 20px;
   border-radius: 9px;
   margin-bottom: 20px;
   background: #00D8A7;
   /* fallback for old browsers */
   background: -webkit-linear-gradient(to right, #C79C56, #926E2F);
   /* Chrome 10-25, Safari 5.1-6 */
   background: linear-gradient(to right, #C79C56, #926E2F);
   /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.box_le ul.kk01 {
   max-width: 600px;
   width: 100%;
}

.box_le ul.kk01 li+li {
   margin-top: 20px;
}

.box_le ul.kk01 li b {
   display: flex;
   justify-content: flex-start;
   align-items: center;
   width: 100%;
   position: relative;
   color: #000;
   cursor: pointer;
   padding-bottom: 10px;
   border-bottom: 1px white solid;
}

.box_le ul.kk01 li b::after {
   content: '';
   background: url(gf_online_img02.png) no-repeat;
   position: absolute;
   right: 0;
   width: 20px;
   height: 20px;
}

.kk01 li p {
   font-size: 14px;
   color: #000;
   display: none;
}

.kk01 li p span {
   display: block;
   font-size: 14px;
   color: #000;
   background: transparent;
}

.box_le ul.kk01 li b.close02 {
/* background-color: burlywood; */
}

.box_le ul.kk01 li b.close02::after {
   background: url(gf_online_img03.png) no-repeat;
}


#qa_box {}

#qa-list {}
.online_tab_button {
   display: grid;
   grid-template-columns: repeat(4,1fr);
   gap: 20px;
}

.qa-btn {
   width: 98%;
   padding: 3px 1%;
   height: 40px;
   margin: 20px auto 5px;
   background: #00468C;
   border-radius: 30px;
}

.qa-btn a {
   width: 90px;
   height: 30px;
   display: block;
   float: right;
   margin: 4px 5px;
   font-size: 15px;
   font-weight: bold;
   line-height: 30px;
   text-align: center;
   text-decoration: none;
   border: 1px solid #fff;
   background: #00468C;
   color: #fff;
   filter: alpha(opacity=100);
   opacity: 1;
   border-radius: 30px;
}

.qa-btn a:hover {
   filter: alpha(opacity=85);
   opacity: .85;
}

.qa-btn a.close {
   float: right;
}

.anser {
   display: none;
   padding: 20px 7px;
}

.qa-box:last-child {
}

.qa-box h5 {
   display: flex;
   align-items: center;
   justify-content: center;
   flex-flow: column;
   align-content: center;
   min-height: 80px;
   cursor: pointer;
   position: relative;
   border: 1px solid var(--color_C);
   border-radius: 10px;
   color: var(--color_B);
   transition: .5s ease;
}
.qa-box h5:hover {
   background: var(--color_D);
   color: #FFFFFF;
}
.qa-box span{
   display: block;
   font-family: var(--fm_serif);
   font-size: var(--f18);
   font-weight: 400;
   letter-spacing: 0.05em;
}
.qa-box b{
   display: block;
   font-family: var(--fm_playfair);
   font-weight: 500;
   font-size: var(--f14);
   letter-spacing: 0.05em;
   padding-top: 5px;
}



.qa-box h5:after {
   /* content: ''; */
   background: url(gf_online_img02.png) no-repeat;
   position: absolute;
   top: 14px;
   right: 0;
   width: 20px;
   height: 20px;
}

.qa-box h5.close {
   background: var(--color_E);
   border-color: var(--color_E);
}

.qa-box h5.close:after {
   /* content: ''; */
   background: url(gf_online_img03.png) no-repeat;
   position: absolute;
   top: 14px;
   right: 0;
   width: 20px;
   height: 20px;
}

.box_le p {
   background: url(gf_online_img04.png) no-repeat left 6px;
   font-size: 14px;
   color: #000;
   line-height: 175%;
   padding: 3px 3px 3px 25px;
   margin-bottom: 5px;
}

.box_le p span {
   color: #FF0;
   font-weight: 100;
   background: #d90000;
   padding: 1px 5px;
}



@media screen and (max-width: 1024px) {
.box_le h4 {}
}

@media screen and (max-width: 840px) {
.box_le h4 {}
.online_box .box_le,.online_box .box_ri {}
.box_le em {display: inline;}
}

@media screen and (max-width: 500px) {
.show_content {}
.box_le em {}
}

.ser01 {
   padding: 195px 20px 165px 20px;
   background-image: url("../xi_img/uxi_img023.jpg");
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
}

.ser01 h5 {
   display: flex;
   flex-direction: column;
   align-items: center;
}

.ser01 h5 b {
   display: block;
   color: #926E30;
   font-weight: bold;
   line-height: 120%;
   letter-spacing: 0.05em;
   text-indent: 0.05em;
   text-align: center;
   text-shadow: 1px 1px 10px rgba(255, 255, 255, 0.65);
}

.ser01 h5 em {
   display: block;
   color: #926E30;
   font-weight: bold;
   line-height: 120%;
   letter-spacing: 0.05em;
   text-indent: 0.05em;
   text-align: center;
   font-style: normal;
   margin-top: 10px;
   text-shadow: 1px 1px 5px rgba(255, 255, 255, 0.7);
}


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

@media screen and (max-width:840px) {
.online_tab_button{grid-template-columns: repeat(2,1fr);}
}

@media screen and (max-width:768px) {
.ser01 {padding: 80px 20px;}
.ser01 h5 b,.ser05 h5 em {}
.ser01 h5 em {}
}

@media screen and (max-width:600px) {
.ser01 h5 b {}
.ser01 h5 em {}
}

@media screen and (max-width:425px) {
.online_tab_button{grid-template-columns: 1fr;gap: 10px;}
}

/* 20240304 */
.online_border{
   max-width: 1200px;
   border-bottom: 2px dotted #444444;
   margin: 50px auto;
}

.yurtour_from{
}
.yurtour_from section{
   max-width: 1200px;
   margin: 0 auto;
   padding: 70px 50px;
   background: var(--color_A);
}
.yurtour_from h6{
   font-family: var(--fm_playfair);
   font-size: var(--f32);
   font-weight: 400;
   letter-spacing: 0.05em;
   text-align: center;
}
.yurtour_from h5{
   font-family: var(--fm_serif);
   font-size: var(--f20);
   font-weight: 400;
   letter-spacing: 0.05em;
   text-align: center;
   padding: 10px 0 50px;
}
.yurtour_from ul{
   display: grid;
   grid-template-columns: repeat(2,1fr);
   gap: 40px 20px;
   padding: 0;
   margin: 0 auto;
}
.yurtour_from li{
   font-family: var(--fm_serif);
   color: var(--color_B);
}
.yurtour_from li.yurtour_grid2{
   grid-column: span 2;
}
.yurtour_from h4{
   font-size: var(--f16);
   font-weight: 400;
   padding-bottom: 10px;
}
.yurtour_from span{
   display: inline-block;
}
.yurtour_from input,.yurtour_from select,.yurtour_from textarea{
   background: #FFFFFF;
   border: 1px solid #CCCCCC;
   border-radius: 5px;
   max-width: 100%;
   width: 100%;
   padding: 10px;
   min-height: 45px;
   font-family: var(--fm_serif);
   font-weight: 400;
   font-size: var(--f16);
   color: var(--color_F);
}
.yurtour_from textarea{
   width: 100% !important;
}
.yurtour_from input:focus,.yurtour_from select:focus,.yurtour_from textarea:focus{
   outline: none;
   border-color: var(--color_C);
}

.yurtour_from input[type="date"]::-webkit-calendar-picker-indicator,.yurtour_from input[type="time"]::-webkit-calendar-picker-indicator{
  cursor: pointer;
}

/* select樣式 */
.yurtour_select{
   position: relative;
}
.yurtour_select select{
   appearance:none;
   -moz-appearance:none;
   -webkit-appearance:none;
   padding-right: 35px;
   cursor: pointer;
}
.yurtour_select select::-ms-expand{
   display: none;
}
.yurtour_select::after{
   content: '';
   width: 10px;
   height: 7px;
   display: block;
   background: url(../img/arrow_B.svg) center no-repeat;
   position: absolute;
   right: 15px;
   top: calc(50% - 3.5px);
}
li.online_send{
   align-self: flex-end;
}
.online_from_code{
   display: flex;
   align-items: center;
   justify-content: space-between;
   max-width: 360px;
}
.online_from_code input[type="text"]{
   width: calc(100% - 80px);
}
.online_from_code a{
   cursor: pointer;
}
.yurtour_from button{
   display: flex;
   align-items: center;
   justify-content: space-between;
   max-width: 200px;
   width: 100%;
   background: var(--color_D);
   border: none;
   margin: 0 0 0 auto;
   padding: 0;
   cursor: pointer;
   transition: .5s ease;
}
.yurtour_from button:hover{
   background: var(--color_B);
}
.yurtour_from ins{
   display: block;
   width: calc(100% - 40px);
   padding: 0 20px;
   font-family: var(--fm_serif);
   font-weight: 400;
   font-size: var(--f18);
   letter-spacing: 0.05em;
   text-align: left;
   color: #FFFFFF;
   text-decoration: none;
   transition: .5s ease;
}
.yurtour_from button:hover ins{
   transform: translateX(calc(100% - 70px));
}
.yurtour_from i{
   display: flex;
   align-items: center;
   justify-content: center;
   max-width: 40px;
   width: 100%;
   min-height: 40px;
}
.yurtour_from i img{
   filter: brightness(20);
}
@media screen and (max-width:768px) {
.yurtour_from section{padding: var(--padY) 20px;}
.yurtour_from ul{grid-template-columns: 1fr;gap: 20px;}
.yurtour_from li.yurtour_grid2{grid-column: initial;}
}
@media screen and (max-width:600px) {
.yurtour_from h6{font-size: var(--f28);}
}