@charset "UTF-8";

/*reset start*/

    html,
    body,
    h1,
    h2,
    h3,
    h4,
    h5,
    p,
    ul,
    li,
    dl,
    dt,
    dd {
        margin: 0;
        padding: 0;
        line-height: 1.0;
    }

    ul {
        list-style: none;
    }

    a {
        text-decoration: none;
        color: inherit;
    }

    img {
        border: none;
        vertical-align: bottom;
        max-width: 100%;
    }

    html {
        font-size: 62.5%;
    }

    body {
        background: #f7f7f7;
        color: #333;
        font-size: 1.6rem;
        font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    }

    table {
        border-collapse: collapse;
        border-spacing: 0;
    }

    input,
    button,
    select,
    textarea {
        appearance: none;
        background: transparent;
        border: none;
        border-radius: 0;
        font: inherit;
        outline: none;
    }

    textarea {
        resize: vertical;
    }

    hr {
        visibility: hidden;
        height: 30px;
    }

/*reset end*/

/*header start*/

    #headerbox {
        background-color: #fff;
    }

    #headerbox .container {
        display: flex;
        align-items: center;
    }

    #headerbox h1 img {
        width: 265px;
        height: auto;
        display: inline-block;
    }

    #headerbox ul {
        width: 640px;
        height: auto;
        display: flex;
    }

    #headerbox ul li {
        flex-grow: 1;
        text-align: center;
        font-size: 17px;
        font-weight: bold;
    }

    #headerbox ul li + li {
        border-left: 1px solid #333;
    }

    #headerbox ul li a:hover {
        color: #008856;
        text-decoration: underline;
    }

    #headerbox p{
        display: inline-block;
    }

    .bottom-line {
        height: 5px;
        width: 100%;
        font-size: 0;
        position: relative;
        bottom: 0;
        left: 0;
        right: 0;
    }

    .inner-line { display: inline-block; width: 20%; height: 5px; }
    .inner-line.color1 { background: #008856; }
    .inner-line.color2 { background: #44b400; }
    .inner-line.color3 { background: #aad200; }
    .inner-line.color4 { background: #e9ed00; }
    .inner-line.color5 { background: #fff100; }

/*header end*/

/*pankuzu start*/
    ul#panbox {
        width: 1200px;
        height: auto;
        margin: 15px auto;
    }

    ul#panbox  li {
        display: inline;
        font-size: 14px;
    }

    ul#panbox li::after {
        content: '＞';
        padding: 0 5px;
    }

    ul#panbox li:last-child::after {
        content: '';
    }

    ul#panbox li a {
        display: inline-block;
        color: #008856;
        text-decoration: underline;
    }

    ul#panbox li a:hover {
        text-decoration: none;
    }

/*pankuzu end*/

/*title start*/

    h2 {
        padding: 30px 0 10px 0;
        font-size: 3.6rem;
        color: #008856;
    }

/*title end*/

/*tab start*/

    #tabbox {
        display: flex;
        flex-wrap: wrap;
        padding: 50px 0;
    }

    #tabbox-only{
        display: flex;
        flex-wrap: wrap;
        padding: 0 0 50px 0;
    }

    .tablabel {
        flex: 1;
        order: -1;
        padding-bottom: 30px;
        text-align: center;
        font-size: 2.4rem;
        color: #333;
        border-bottom: 10px solid #ccc;
        border-right: 1px solid #ccc;
        position: relative;
    }

    #tabbox .tablabel>a{
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
    }

    .tablabel-disable {
        flex: 1;
        order: -1;
        padding-bottom: 30px;
        text-align: center;
        font-size: 2.4rem;
        color: #333;
        border-bottom: 10px solid #ccc;
        border-right: 1px solid #ccc;
        border-left: 1px solid #ccc;
        opacity: 0.5;
    }
    

    .tablabel-wing {
        order: -1;
        opacity: 0.5;
        cursor: pointer;
    }

    #tabbox-wing input:checked + .tablabel-wing {
        opacity: 1;
    }

    .tablabel:nth-last-of-type(1) {
        border-right: none;
    }

    .tablabel:hover {
        color: #008856;
        cursor: pointer;
    }

    #tabbox > input,#tabbox-only > input,#tabbox-wing > input {
        display: none;
    }

    #tabbox .content,#tabbox-wing .content-wing {
        width: 100%;
        height: 0;
        overflow: hidden;
        opacity: 0;
    }
    
    #tabbox input:checked + .tablabel {
        position: relative;
        color: #008856;
        font-weight: bold;
        border-bottom: 10px solid #008856;
    }

    #tabbox input:checked + .tablabel:after {
        top: 100%;
        left: 50%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;  
        border-top-color: #008856;
        border-width: 24px;
        margin-left: -24px;
    }
    
    #tabbox input:checked + .tablabel + .content,#tabbox-only .content {
        width: 100%;
        padding: 50px 0;
        height: auto;
        overflow: auto;
        opacity: 1;
    }

    .tabbox-title {
        font-size: 4.4rem;
        font-weight: bold;
        padding: 0 0 30px 45px;
    }

    .tabbox-ij9c {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }

    .tabbox-wingij {
        background-color: #fff;
        display: flex;
    }

    .tabbox-wing9c { 
        margin:0 0 0 70px;
        background-color: #fff;
        display: flex;
    }

    .tabbox-wingij img,.tabbox-wing9c img {
        width: 90px;
        height: 83px;
        margin: 0 0 0 -70px;
    }

    .tabbox-wingij div,.tabbox-wing9c div {
        width: 300px;
        height: auto;
        text-align: center;
        font-size: 20px;
    }

    .tabbox-wingij div p:nth-of-type(1),.tabbox-wing9c div p:nth-of-type(1) {
        font-weight: bold;
        margin: 20px 0 10px 0;
    }

    #tabbox #tabbox-wing {
        display: flex;
        justify-content: flex-end;
        flex-wrap: wrap;
        margin-top: -70px;
    }

    #tabbox-only #tabbox-wing {
        display: flex;
        justify-content: flex-end;
        flex-wrap: wrap;
    }

    #tabbox-wing input:checked + .tablabel-wing + .content-wing {
        height: auto;
        overflow: auto;
        opacity: 1;
    }
    
    .notab {
        margin: 30px 0;
    }

/*tab end*/

/*contents start*/

    .contentsbox {
        width: 1100px;
        padding: 50px;
        background-color: #fff;
    }

    .contentsbox .subtitle-1 {
        font-size: 2.4rem;
        font-weight: bold;
        margin-bottom: 20px;
        padding: 3px 10px;
        border-left: 6px solid #008856;
        color: #008856;
    }

    .contentsbox .subtitle-1:nth-child(n + 2) {
        margin-top: 50px;
    }

    .contentsbox .subtitle-2 {
        font-weight: bold;
        margin: 20px 0;
    }

    .contentsbox .subtitle-3 {
        font-weight: bold;
        margin: 10px 0;
    }

    .contentsbox p {
        line-height: 2;
    }

    ol.normal-list {
        margin-left: -2rem;
    }

    ol.normal-list li {
        line-height: 2;
    }

    .container {
        width: 1200px;
        height: auto;
        margin: 0 auto;
    }

    dl.introduction {
        margin: 0 0 40px 0;
        display: flex;
    }

    dl.introduction dt {
        float: left;
    }

    dl.introduction dd.introij {
        width: 938px;
        height: 41px;
        display: flex;
        justify-content: space-between;
        align-items:center;
        padding: 0 20px;
        background-color: rgba(233, 237, 0, 0.1);
    }

    dl.introduction dd.intro9c {
        width: 938px;
        height: 41px;
        display: flex;
        justify-content: space-between;
        align-items:center;
        padding: 0 20px;
        background-color: rgba(0, 136, 86, 0.1);
    }

    /*table start*/

    table.table-basic {
        width: 100%;
        text-align: center;
        margin-bottom: 30px;
    }

    table.table-basic th,table.table-basic td {
        padding: 10px;
        border: solid 1px #ccc;
        font-weight: normal;
    }

    table.table-basic th p {
        line-height: 1.4;
    }

    .fixwidth {
        table-layout: fixed;
    }

    .result-text td p {
        font-weight: bold;
    }

    .bgcolor {
        background-color: #ddf4d3;
    }

    .table-basic ul {
        margin-left: 20px;
        list-style-type: disc;
    }

    .table-basic ul li {
        line-height: 2;
    }

    .width15per {
        width: 15%;
    }

    /*table end*/


    /*送信フォーム start*/

    .form-inquiry{
        margin-top: 30px;
        margin-bottom: 50px;
        border: 1px solid #008856;
    }

    .form-inquiry .tab-wrap {
        display: flex;
        flex-wrap: wrap;
    }

    .tab-form {
        width: 100%;
        display: none;
    }

    #tab-form-cn {
        font-family: Microsoft YaHei UI;
    }
    
    .form-inquiry #TAB-01:checked+.tab-label,
    .form-inquiry #TAB-02:checked+.tab-label,
    .form-inquiry #TAB-03:checked+.tab-label {
        color: #ffffff;
        background: #44b400 ;
    }
    
    .form-inquiry .tab-switch:checked+.tab-label+.tab-form {
         display: block;
    }

    .form-inquiry .tab-label {
        background: LightGray;
        width: 150px;
        display: inline-block;
        height: 20px;
        line-height: 40px;
        border-radius: 15px;
        text-align: center;
    }
    .form-inquiry .tab-form {
        width: 100%;
        padding-top: 3rem;
    }
    
    .form-inquiry .tab-form .news-link{
        width: 100%;
        padding-top: 3rem;
    }

    .form-inquiry p{
        margin: 10px;
        padding: 10px;
        height: 15px;
    }

    .tab-form {
        width: 100%;
        display: none;
    }

    #form-content p{
        line-height: 20px;
        margin-bottom: 20px;
    }

    table.table-form {
        width: 100%;
        text-align: center;
        margin-bottom: 30px;
    }

    table.table-form th {
        width: 260px;
        text-align: left;
        vertical-align: top;
    }

    .table-form th p{
        line-height: 20px;
    }

    table.table-form td {
        padding: 20px;
        font-weight: normal;
    }

    .table-form td p{
        line-height: 20px;
        margin-top: -5px;
    }

    #table-form-document th{
        vertical-align: middle;
    }

    .fixwidth {
        table-layout: fixed;
    }

    .bgcolor {
        background-color: #ddf4d3;
    }

    .table-form ul {
        margin-left: 20px;
        list-style-type: disc;
    }

    .width15per {
        width: 15%;
    }

    .form-search-input {
        border: 3px solid #008856;
        border-radius: 5px;
        width: 99%;
        height: 55px;
        letter-spacing: 0.1em;
        margin-left: 5px;
        padding-left: 20px;
        background: #fff;
        color: #333;
    }

    #form-hissu{
        color: #f00;
        font-weight: bold;
    }

    #form-inputcolumn{

        text-align: right;
    }

    #form-check{
        text-align: center;
    }

    #form-check p{
        margin-top: 5px;
    }

    #kome-form-document{
        margin-top: 10px;
    }

    .form-input{
        border: 3px solid #008856;
        border-radius: 5px;
        width: 99%;
        height: 150px;
        letter-spacing: 0.1em;
        margin-left: 5px;
        padding-left: 20px;
        background: #fff;
        color: #333;
    }

    .button-fileselect {
        text-align: center;
        position: relative;
    }

    .button-fileselect a {
        position: relative;
        display: inline-block;
        width: 700px;
        height: auto;
        padding: 2rem 0;
        text-align: center;
        font-size: 2rem;
        font-weight: bold;
        color: #008856;
        background-color: #fff;
        border: 3px solid  #008856;
        border-radius: 5px;
    }

    .button-fileselect a:after {
        content: "";
        position: absolute;
        top: 50%;
        bottom: 0;
        right: 3rem;
        display: flex;
        justify-content: center;
        align-items: center;
        transition: right .3s;
        width: 6px;
        height: 6px;
        border-top: solid 2px currentColor;
        border-right: solid 2px currentColor;
        transform: translateY(-50%) rotate(45deg);
    }

    .button-fileselect a:hover {
        opacity: 0.9;
    }

    .button-fileselect a:hover:after {
        right: 2rem;
    }
    .change-img{
        font-size: 16px;
        position: relative;
        display: inline-block;
        width: 700px;
        height: auto;
        padding: 20px 0;
        text-align: center;
        font-weight: bold;
        color: #008856;
        background-color: #fff;
        border: 3px solid  #008856;
        border-radius: 5px;
    }
    .upload-box{
        position: relative;
        display: inline-block;
        width: 700px;
        height: 66px;
        padding: 20px 0;
        text-align: center;
        font-size: 20px;
        font-weight: bold;
        color: #008856;
        background-color: #fff;
        border: 3px solid  #008856;
        border-radius: 5px;
        box-sizing: border-box;
    }
    .upload-box:after {
        content: "";
        position: absolute;
        top: 50%;
        bottom: 0;
        right: 3rem;
        display: flex;
        justify-content: center;
        align-items: center;
        transition: right .3s;
        width: 6px;
        height: 6px;
        border-top: solid 2px currentColor;
        border-right: solid 2px currentColor;
        transform: translateY(-50%) rotate(45deg);
    }
    .upload-box:hover:after {
        right: 2rem;
    }
    .form-select {
        width: 210px;
        height: 3.5em;
        margin: 0 auto;
    }

    .form-select select {
        width: 210px;
        height: 3.5em;
        padding: 10px;
        background-color: #fff;
        border: 3px solid #008856;
        border-radius: 5px;
    }

    .form-select select::-ms-expand {
        display: none;
    }

    .form-select.subjects {
        position: relative;
    }

    .form-select.subjects::before {
        position: absolute;
        top: 1.7em;
        right: 30px;
        width: 0;
        height: 0;
        padding: 0;
        content: '';
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        border-top: 6px solid #008856;
        pointer-events: none;
    }

    #form-select-long{
        width: 250px;
    }

    #form-check input[type="checkbox"]{
        display: none;
    }

    /* チェックボックスの代わりを成すラベル */
    #form-check input[type="checkbox"]+label{
        display: none;
        cursor: pointer;
        display: inline-block;
        position: relative;
        padding-left: 25px;
        padding-right: 10px;
    }
    /* ラベルの左に表示させる正方形のボックス□ */
    #form-check input[type="checkbox"]+label::before{
        content: "";
        position: absolute;
        display: block;
        box-sizing: border-box;
        width: 20px;
        height: 20px;
        margin-top: -10px;
        left: 0;
        top: 50%;
        border: 1px solid;
        border-color:  #585753; /* 枠の色変更 お好きな色を */
        background-color: #FFF; /* 背景の色変更 お好きな色を */
    }
    /* チェックが入った時のレ点 */
    #form-check input[type="checkbox"]:checked+label::after{
        content: "";
        position: absolute;
        display: block;
        box-sizing: border-box;
        width: 18px;
        height: 9px;
        margin-top: -9px;
        top: 50%;
        left: 3px;
        transform: rotate(-45deg);
        border-bottom: 3px solid;
        border-left: 3px solid;
        border-color:  #585753; /* チェックの色変更 お好きな色を */
    }

    /*送信フォーム end*/    

    /*text color link start*/
    .content p a,.content li a,.notab p a,.notab .notice li a,label a {
        color: #008856 !important;
        text-decoration: underline !important;
    }
    .tablabel a,.tablabel-wing a{
        color: inherit !important;
        text-decoration: none !important;
    }

    .content p a:hover,.content li a:hover,.notab p a:hover,.notab .notice li a:hover,label a:hover {
        text-decoration: none;
    }

    .attention {
        color: #f00;
    }

    .notice.attention {
        font-weight: bold;
    }

    .kome p {
        margin-left: 1rem;
        padding-left: 1rem;
        text-indent: -2rem;
    }

    .kome p:before {
        content: "※";
        padding-right: 0.5rem;
    }

    .kome li {
        margin-left: 2rem;
        padding-left: 1rem;
        text-indent: -3rem;
        line-height: 2;
    }

    .kome li:first-child:before {
        content: "※1";
        padding-right: 0.5rem;
    }

    .kome li:nth-child(2):before {
        content: "※2";
        padding-right: 0.5rem;
    }

    .kome li:nth-child(3):before {
        content: "※3";
        padding-right: 0.5rem;
    }

    .kome li:nth-child(4):before {
        content: "※4";
        padding-right: 0.5rem;
    }

    .kome li:nth-child(5):before {
        content: "※5";
        padding-right: 0.5rem;
    }

    .cnt {
        text-align: center;
    }

    .arrowlink::before {
        content: "";
        display: inline-block;
        width: 7px;
        height: 12px;
        background-image:url(https://media.springairlines.com/cache/style/site5/rules/images/linkarrow.svg);
        background-size: contain;
        vertical-align: middle;
        margin: 0 5px 2px 0;
    }

    .externallink::before {
        content: "";
        display: inline-block;
        width: 15px;
        height: 15px;
        background-image:url(https://media.springairlines.com/cache/style/site5/rules/images/icon_externallink.png);
        background-size: contain;
        vertical-align: middle;
        margin: 0 5px 2px 5px;
    }

    /*text color link end*/

    /*font size start*/

    .size15 {
        font-size: 1.4rem;
    }

    .size20 {
        font-size: 2rem;
    }

    /*font size end*/

    /*list style start*/

    .nocircle {
        list-style-type: none;
    }

    .normal-list-disc {
        list-style-type: disc;
        margin: 10px 0 10px 1em;
    }

    .normal-list-disc li {
        line-height: 2;
    }

    /*list style end*/

    /*位置調整 start*/

    .topimg {
        margin-bottom: 30px;
    }

    .left-j {
        text-align: left;
    }

    .right-j {
        text-align: right;
    }
    
    .top-j {
        vertical-align: top;
    }

    .center-j {
        text-align: center;
    }

    /*位置調整 end*/

    /*button start*/
    .button-basic {
        margin: 50px 0;
        text-align: center;
    }

    .button-basic a {
        position: relative;
        display: inline-block;
        width: 500px;
        height: auto;
        padding: 2rem 0;
        text-align: center;
        font-size: 2rem;
        font-weight: bold;
        color: #fff !important;
        background-color: #008856;
        border-radius: 5px;
    }

    .button-basic a:after {
        content: "";
        position: absolute;
        top: 50%;
        bottom: 0;
        right: 3rem;
        display: flex;
        justify-content: center;
        align-items: center;
        transition: right .3s;
        width: 6px;
        height: 6px;
        border-top: solid 2px currentColor;
        border-right: solid 2px currentColor;
        transform: translateY(-50%) rotate(45deg);
    }

    .button-basic a:hover {
        opacity: 0.9;
    }

    .button-basic a:hover:after {
        right: 2rem;
    }

    .button-formside {
        margin-top: -2.4rem;
    }

    .button-formside a,.button-confirm a {
        width: 10%;
        display: inline;
        padding: 1.6rem 10px;
        text-align: center;
        color: #fff;
        background-color: #008856;
        border-radius: 10px;
    }

    .button-formside a:hover,.button-confirm a:hover {
        opacity: 0.9;
    }

    .button-option a {
        width: 10%;
        display: inline;
        padding: 1.6rem 10px;
        text-align: center;
        color: #333;
        background-color: #fff;
        border: 1px solid #008856;
        border-radius: 10px;
    }

    .button-option a:hover {
        opacity: 0.9;
        background-color: #ddf4d3;
    }

    .button-form {
        margin: 30px 0;
        text-align: center;
    }
    
    .button-form  a{
        display: inline;
        padding: 1.6rem 10rem;
        text-align: center;
        color: #fff;
        background-color: #008856;
        border-radius: 10px;
    }

    .button-form a:hover {
        opacity: 0.9;
    }

    .button-result {
        text-align: center;
        margin: 10px 0;
    }

    .button-result a{
        width: 90px;
        display: inline-block;
        padding: 10px;
        text-align: center;
        color: #fff;
        background-color: #008856;
        border-radius: 10px;
    }

    .button-result a:hover {
        opacity: 0.9;
    }

    /*button end*/

    /*注意事項 start*/

    .notice {
        margin: 20px 0;
        padding: 30px;
        background-color: #fff2f2;
    }

    .notice h3 {
        margin: 0 0 20px 0;
        font-size: 2.4rem;
        color: #f00;
    }

    .notice h3::before {
        content: "";
        display: inline-block;
        width: 30px;
        height: 27px;
        background-image:url(https://media.springairlines.com/cache/style/site5/rules/images/icon_notice.png);
        background-size: contain;
        vertical-align: middle;
        margin: 0 5px 5px 0;
    }

    .notice ul {
        margin: 0 0 0 20px;
        list-style-type: disc;
    }

    .notice ul li,.notice ol li {
        line-height: 2;
    }

    .notice .arrowlink a {
        color: #008856;
        text-decoration: underline;
    }

    .notice .arrowlink a:hover {
        color: #008856;
        text-decoration: none;
    }

    /*注意事項 end*/

    /*よくあるご質問 start*/

    .faq-box {
        margin: 30px 0;
        padding: 30px;
        background-color: #ddf4d3;
    }

    .faq-box h3 {
        margin: 0 0 20px 0;
        font-size: 2.4rem;
        color: #008856;
    }

    .faq-box h3::before {
        content: "";
        display: inline-block;
        width: 30px;
        height: 30px;
        background-image:url(https://media.springairlines.com/cache/style/site5/rules/images/icon_faq.png);
        background-size: contain;
        vertical-align: middle;
        margin: 0 5px 5px 0;
    }

    .faq-box dl dt {
        font-weight: bold;
        line-height: 1;
    }

    .faq-box dl dd {
        margin-bottom: 2rem;
        padding: 1rem 0;
        line-height: 1;
        border-bottom: 2px dotted #008856;
    }

    .faq-box dl dd span {
        font-weight: bold;
    }
  
    dl.faq-accordion {
        margin: 0 auto 20px auto;
        padding-top: 10px;
        border-bottom: 2px dotted #008856;
    }
  
    dl.faq-accordion dt {
        padding: 20px 0;
        background: url(https://media.springairlines.com/cache/style/site5/rules/images/icon_open.png) 97% center no-repeat;
        cursor: pointer;
    }

    dl.faq-accordion dt:nth-child(n+2) {
        border-top: 2px dotted #008856;
    }
    
    dl.faq-accordion dt.open {
        background: url(https://media.springairlines.com/cache/style/site5/rules/images/icon_close.png) 97% center no-repeat;
    }
  
    dl.faq-accordion dd {
        padding: 20px;
        margin-bottom: 5px;
        color: #333;
        display: none;
        border: none;
    }

    /*よくあるご質問 end*/

    /*各インフォメーション start*/

    .informationbox {
        width: 100%;
        height: auto;
        padding: 50px 0;
        background-color: #f7f7f7;
        text-align: center;
    }
    
    .informationbox .button-basic {
        margin: 30px 0 0 0;
    }

    .informationbox p {
        margin: 0 30px;
    }
    /*各インフォメーション end*/

    /*popup start*/
    .modal_wrap input{
        display: none;
    }
    
    .modal_overlay{
        display: flex;
        justify-content: center;
        overflow: auto;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 9999;
        width: 100%;
        height: 100%;
        opacity: 0;
        transform: scale(0);
    }
    
    .modal_trigger{
        position: absolute;
        width: 100%;
        height: 100%;
    }
    
    .popup-ij {
        position: relative;
        align-self: center;
        width: 550px;
        max-height: 500px;
        overflow-y: auto;
        padding: 30px 30px 15px 30px;
        box-sizing: border-box;
        background: #fff;
        border-left: 5px solid #44b400;
        line-height: 1.4em;
        transition: 0.5s;
    }

    .popup-ij h3,.popup-9c h3 {
        padding: 0 0 5px 0;
        font-size: 2.4rem;
        font-weight: bold;
        text-align: center;
        border-bottom: 1px solid #ccc;
    }

    .popup-ij h4 {
        font-size: 2rem;
        padding: 20px 0;
    }

    .popup-ij ul,.popup-9c ul {
        display: flex;
        flex-wrap: wrap;
    }

    .popup-ij ul li,.popup-9c ul li {
        width: 47%;
        margin: 5px;
        font-weight: bold;
        border: 1px solid #ccc;
        text-align: center;
    }

    .popup-ij ul li h5,.popup-9c ul li h5 {
        margin: 20px;
        font-size: 2.4rem;
    }

    .popup-ij ul li a {
        width: 80%;
        display: inline-block;
        margin: 0 auto 10px auto;
        padding: 10px;
        color: #fff;
        border-radius: 10px;
        text-decoration: none;
        background-color: #44b400;      
        border-radius: 5px;
    }

    .popup-ij ul li a:hover,.popup-9c ul li a:hover {
        width: 80%;
        display: inline-block;
        margin: 0 auto 10px auto;
        padding: 10px;
        opacity: 0.8;   
        border-radius: 5px;
    }

    .popup-9c {
        position: relative;
        align-self: center;
        width: 550px;
        max-height: 500px;
        overflow-y: auto;
        padding: 30px 30px 15px 30px;
        box-sizing: border-box;
        background: #fff;
        border-left: 5px solid #008856;
        line-height: 1.4em;
        transition: 0.5s;
    }

    .popup-9c ul li a {
        width: 80%;
        display: inline-block;
        margin: 0 auto 10px auto;
        padding: 10px;
        color: #fff;
        border-radius: 10px;
        text-decoration: none;
        background-color: #008856;
        border-radius: 5px;
    }
    
    .close_button{
        position: absolute;
        top: 14px;
        right: 16px;
        font-size: 24px;
        cursor: pointer;
    }
    
    .modal_wrap input:checked ~ .modal_overlay{
        opacity: 1;
        transform: scale(1);
        transition: opacity 0.5s;
    }
    
    /*popup end*/

    /*お知らせ一覧 start*/

    .news-all{
        margin-top: 30px;
        margin-bottom: 50px;
        border: 1px solid #008856;
    }

    .news-all .tab-wrap {
        display: flex;
        flex-wrap: wrap;
    }

    .tab-news-all {
        width: 100%;
        display: none;
    }
    
    .news-all #TAB-01:checked+.tab-label {
        color: #ffffff;
        background: #44b400 ;
    }

    .news-all #TAB-02:checked+.tab-label {
        color: #008856;
        background: #e9ed00 ;
    }

    .news-all #TAB-03:checked+.tab-label {
        color: #ffffff;
        background: #008856 ;
    }

    .news-all .tab-switch:checked+.tab-label+.tab-news-all {
         display: block;
    }

    .news-all .tab-label {
        background: LightGray;
        width: 150px;
        display: inline-block;
        height: 15px;
        line-height: 35px;
        border-radius: 20px;
        text-align: center;
    }

    .news-all .tab-news-all {
        width: 100%;
        padding-top: 3rem;
    }
    
    .news-all .tab-news-all .news-link{
        width: 100%;
        padding-top: 3rem;
    }

    .news-all .tab-news-all a.news-link:hover{
        color: #008856;
        text-decoration: underline;
    }

    .news-all .news-genre-important{
        color: #ffffff;
        background-color: #f00;
        padding: 3px 10px 3px 10px;
        margin-left: 20px;
        margin-right: 20px;
        border-radius: 40px;
        text-align: center;
    }

    .news-all .news-genre-ij{
        color: #008856;
        background-color: #e9ed00;
        width: 300px;
        padding: 3px 10px 3px 10px;
        margin-left: 20px;
        margin-right: 20px;
        border-radius: 40px;
        text-align: center;
    }

    .news-all .news-genre-9C{
        color: #ffffff;
        background-color: #008856;
        width: 300px;
        padding: 3px 10px 3px 10px;
        margin-left: 20px;
        margin-right: 20px;
        border-radius: 40px;
        text-align: center;
    }

    .news-all p{
        margin: 10px;
        padding: 10px;
        height: 15px;
    }

    .news-all ul.pagebutton {
        text-align: center;
        padding-top: 40px;
        width: 100%;
    }
    
    .news-all ul.pagebutton li {
        display: inline;
        margin: 0 1px;
        padding: 0;
    }
    
    .news-all ul.pagebutton li span,
    .news-all ul.pagebutton li a {
        color: #008856;
        display: inline-block;
        padding: 5px 10px;
        background: #fff;
        border: 1px solid #008856;
        vertical-align: middle;
        text-decoration: none;
        border-radius: 3px;
    }
    
    .news-all ul.pagebutton li a:hover {
        background: #efefef;
    }

    .news-all ul.pagebutton li a:checked {
        background: #008856;
    }

    .news-all ul.pagebutton li.pagebutton-on a {
        background-color: #008856;
        color: #fff;
    }

    .news-all img{
        width: 13px;
        height: 13px;
        padding-bottom: 2px;
    }

    /*お知らせ一覧* end/


    /*お知らせ詳細 start*/

    .news{
        margin-top: 30px;
        border: 1px solid #008856;
    }

    .news h3{
        font-weight: bold;
        margin-top: 5px;
        margin-bottom: 4rem;
        padding: 1rem 0;
        line-height: 1;
        border-bottom: 2px solid #cccccc;
    }

    .news .h5-ij{
        margin-top: auto;
        margin-bottom: 2rem;
        display: inline-block;
        padding: 5px;
        line-height: 20px;
        border-radius: 10px;
        text-align: center;
        background-color: #e9ed00;
        color: #008856;
    }

    .news .h5-c9{
        margin-top: auto;
        margin-bottom: 2rem;
        display: inline-block;
        padding: 5px;
        line-height: 20px;
        border-radius: 10px;
        text-align: center;
        background-color: #008856;
        color: #ffffff;
    }

    .news a {
        color: #008856;
        text-decoration: underline;
    }

    .news .arrowlink a {
        color: #008856;
        text-decoration: underline;
    }

    .news-footer{
        margin-top: 3rem;
    }

    .news-footer p{
        margin-bottom: 15px;
    }

    .news-footer a {
        color: #008856;
        text-decoration: underline;
    }

    /*お知らせ詳細 end*/

    /*3つの運賃タイプ start*/

    .types-box {
        display: flex;
        flex-wrap: wrap;
        margin:20px 0;
    }

    .types-box:after {
        content: '';
        width: 100%;
        height: 5px;
        display: block;
        order: -1;
    }

    .types-box label:first-of-type {
        border: 3px solid #fff100;
    }

    .types-box label:first-of-type .type-bg {
        display: block;
        width: 100%;
        height: 40px;
        background-color: #fff100;
    }

    .types-box label:first-of-type .type-title {
        background-color: #fff100;
    }

    .types-box label:nth-of-type(2) {
        border: 3px solid #e9ed00;
    }

    .types-box label:nth-of-type(2) .type-bg {
        display: block;
        width: 100%;
        height: 40px;
        background-color: #e9ed00;
    }

    .types-box label:nth-of-type(2) .type-title {
        background-color: #e9ed00;
    }

    .types-box label:nth-of-type(3) {
        border: 3px solid #aad200;
    }

    .types-box label:nth-of-type(3) .type-bg {
        display: block;
        width: 100%;
        height: 40px;
        background-color: #aad200;
    }

    .types-box label:nth-of-type(3) .type-title {
        background-color: #aad200;
    }

    .osusume {
        position: absolute;
        top: -30px;
        left: 5px;
    }

    .tab-label,.tab-label-int {
        color: #333;
        padding: 0 0 20px 0;
        order: -1;
        position: relative;
        z-index: 1;
        cursor: pointer;
        border-radius: 5px 5px 0 0;
        flex: 1;
        width: 30%;
        background-color: #fff;
    }

    .tab-label img.catchimg,.tab-label-int img.catchimg {
        position: absolute;
        top: -45px;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
    }

    .type-catch {
        display: block;
        padding: 5px 0;
        background-color: #fff;
        font-weight: bold;
        text-align: center;
    }

    .type-title {
        display: block;
        padding: 13px 0 10px 0;
        margin: 0 0 20px 0;
        font-size: 3rem;
        font-weight: bold;
        text-align: center;
    }

    .type-merit {
        display: block;
        text-indent: -1em;
        padding-left: 1em;
        margin: 0 10px 5px 10px;
        font-size: 1.6rem;
        font-weight: bold;
        line-height: 1.2;
        background-color: #fff;
    }

    .tab-label:not(:last-of-type),.tab-label-int:not(:last-of-type) {
        margin-right: 5px;
    }

    .tab-content {
        width: 100%;
        height: 0;
        overflow: hidden;
        opacity: 0;
    }

    .tab-switch:checked+.tab-label,.tab-switch:checked+.tab-label-int {
        margin-bottom: -8px;
        border-bottom: 3px solid #fff;
      }
     
    .tab-switch:checked+.tab-label:first-of-type+.tab-content,.tab-switch:checked+.tab-label-int:first-of-type+.tab-content {
        height: auto;
        overflow: auto;
        padding: 25px 15px 10px 15px;
        opacity: 1;
        transition: .5s opacity;
        border: 3px solid #fff100;
    }

    .tab-switch:checked+.tab-label:nth-of-type(2)+.tab-content,.tab-switch:checked+.tab-label-int:nth-of-type(2)+.tab-content {
        height: auto;
        overflow: auto;
        padding: 25px 15px 10px 15px;
        opacity: 1;
        transition: .5s opacity;
        border: 3px solid #e9ed00;
    }

    .tab-switch:checked+.tab-label:nth-of-type(3)+.tab-content,.tab-switch:checked+.tab-label-int:nth-of-type(3)+.tab-content {
        height: auto;
        overflow: auto;
        padding: 25px 15px 10px 15px;
        opacity: 1;
        transition: .5s opacity;
        border: 3px solid #aad200;
    }
      
    .tab-switch {
        display: none;
    }

    .tab-content ul {
        display: flex;
        flex-wrap: wrap;
    } 

    .tab-content ul li {
        width: 48%;
        padding: 30px 0;
        margin: 0 10px 20px 10px;
        border-radius: 10px;
        text-align: center;
        background-color: #ddf4d3;
        background-image: url(https://media.springairlines.com/cache/style/site5/rules/images/bg_safe_arrow.png);
        background-repeat: no-repeat;
        background-position: right bottom;
        font-weight: bold;
        font-size: 2.4rem;
        cursor: pointer;
    }

    .tab-content ul li a {
        display: flex;
        margin: 0 10px;
        align-items: flex-start;
        flex-direction: column;
        justify-content:space-between;
        vertical-align: middle;
        color: #333;
        text-decoration: none;
    }

    .tab-content ul li.ticket {
        display: flex;
        align-items: flex-start;
        flex-direction: column;
        justify-content:space-between;
        vertical-align: middle;
        color: #333;
        text-decoration: none;
        background-image: none;
        cursor: auto;
    }

    .tab-content-img {
        margin: 0 auto;
        min-height: 140px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .tab-content-img img {
        width: 100%;   
    }

    .tab-content-text {
        margin: 10px auto 0 auto;
    }

    .tab-content-text-btn {
        margin: 10px auto;
        padding: 5px 20px;
        background-color: #008856;
        color: #fff;
        border-radius: 20px;
    }

    .type-table {
        width: 100%;
        border-collapse: separate;
        border-spacing: 10px;
        text-align: center;
    }

    .type-table th {
        padding: 10px;
        background-color: #f7f7f7;
    }

    .type-table th p {
        font-size: 2rem;
    }

    .type-table td {
        width: 28%;
        padding: 10px;
    }

    .type-table td p {
        font-size: 3rem;
        font-weight: bold;
    }

    .type-table .arrowlink a {
        font-size: 1.6rem;
        color: #008856;
        text-decoration: underline;
        line-height: 1.5;
    }

    .type-table .arrowlink a:hover {
        text-decoration: none;
    }

    .bg_luckyspring {
        position: relative;
        background-color: #fff100;
    }

    .bg_spring {
        position: relative;
        background-color: #e9ed00;
    }

    .bg_springplus {
        position: relative;
        background-color: #aad200;
        box-shadow: 0 0 10px 0 #999;
    }

    .bg_luckyspring span img {
        position: absolute;
        top: -5px;
        left: 42px;
    }

    .bg_spring span img {
        position: absolute;
        top: -5px;
        left: 12px;
    }

    .bg_springplus span img {
        position: absolute;
        top: -5px;
        left: 12px;
    }

    .crown {
       position: absolute;
       top: -35px;
       left: 40%;
    }
   
    .type-table-catch {
        position: relative;
        display: inline-block;
        margin: 1em 0 1.5em 70px;
        padding: 7px 10px;
        min-width: 120px;
        max-width: 100%;
        font-size: 16px;
        font-weight: bold;
        background: #fff;
      }
      
      .type-table-catch:before {
        content: "";
        position: absolute;
        top: 50%;
        left: -25px;
        margin-top: -15px;
        border: 15px solid transparent;
        border-right: 15px solid #fff;
      }
      
      .type-table-catch p {
        margin: 0;
        padding: 0;
      }

      .type-table-strong {
          border: 10px solid #44b400;
      }

      .plusheight {
          border-top: 10px solid #fff;
      }

      dl.btn-accordion {
        margin: 20px auto;
        padding: 10px;
        background-color: #fff;
        border: 1px solid #ccc;
        border-radius: 10px;
    }
  
    dl.btn-accordion dt {
        padding: 20px;
        background: url(https://media.springairlines.com/cache/style/site5/rules/images/icon_btn_open.png) 97% center no-repeat;
        cursor: pointer;
        font-weight: bold;
    }
    
    dl.btn-accordion dt.open {
        background: url(https://media.springairlines.com/cache/style/site5/rules/images/icon_btn_close.png) 97% center no-repeat;
    }
  
    dl.btn-accordion dd {
        padding: 20px;
        margin-bottom: 5px;
        color: #333;
        display: none;
        border: none;
    }

    /*3つの運賃タイプ end*/

    /*時刻表 start*/

    ul.schedule {
        margin: 20px 0;
        font-size: 2rem;
    }

    ul.schedule li{
        line-height: 2;
    }

    ul.schedule li a {
        color: #008856;
        text-decoration: underline;
    }

    ul.schedule li a:hover {
        text-decoration: none;
    }

    ul.schedule li a::before {
        content: "";
        display: inline-block;
        width: 7px;
        height: 12px;
        background-image:url(https://media.springairlines.com/cache/style/site5/rules/images/linkarrow.svg);
        background-size: contain;
        vertical-align: middle;
        margin: 0 10px 2px 0;
    }

    .schedule-title img {
        vertical-align: middle;
        padding-left: 20px;
        padding-right: 20px;
    }

    /*時刻表 end*/

    /*変更・払い戻し・各種手数料 start*/

    .henkobox {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .henkobox dl {
        width: 32%;
        padding: 0 0 30px 0;
        margin-bottom: 20px;
        position: relative;
        border: 1px solid #ccc;
        border-radius: 10px;
        text-align: center;
    }

    .henkobox dl dt {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 160px;
        background-color: #ddf4d3;
        border-radius: 10px 10px 0 0;
    }

    
    .henkobox dl dd {
        margin: 20px 30px 0 30px;
        font-weight: bold;
    }

    .henkobox::after {
        content: "";
        display: block;
        width: 32%;
        height: 0;
    }

    .henkobox dl a {
        position: absolute;
        top: 0;
        left: 0;
        height:100%;
        width: 100%;
    }
    
    .henkobox dl:hover {
        opacity: 0.8;
        background-color: #fff;
    }

    /*変更・払い戻し・各種手数料 end*/

    /*予約の変更・払い戻しオンライン手続き start*/

    .form-result {
        width: 900px;
        background-color: #fff;
        padding: 50px;
        margin: 50px auto 20px auto;
    }

    .flightno::before {
        content: "";
        display: inline-block;
        width: 20px;
        height: 20px;
        background-image:url(https://media.springairlines.com/cache/style/site5/rules/images/icon_plane.png);
        background-size: contain;
        vertical-align: middle;
        margin: 0 5px 5px 0;
    }

    /*予約の変更・払い戻しオンライン手続き end*/

    /*変更・払戻手数料について start*/

    table.table-fee {
        width: 100%;
        text-align: center;
        margin-bottom: 30px;
    }

    table.table-fee th,table.table-fee td {
        font-weight: normal;
    }

    .table-fee-border {
        padding: 10px;
        border: 1px solid #ccc;
    }

    .table-fee td.left-j {
        padding-top: 10px;
        vertical-align: top;
        font-weight: bold;
    }

    .time-top {
        position: relative;
        vertical-align: top;
    }

    .time-top p {
        line-height: 1.2;
    }

    .time-top .time-right {
        position: absolute;
        top: 0;
        right: 0;
    }

    /*変更・払戻手数料について end*/

    /*手荷物について start*/

    .baggagebox {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .baggagebox dl {
        width: 32%;
        padding: 0 0 30px 0;
        margin-bottom: 20px;
        position: relative;
        border: 1px solid #ccc;
        border-radius: 10px;
        text-align: center;
    }

    .baggagebox dl dt {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 160px;
        background-color: #ddf4d3;
        border-radius: 10px 10px 0 0;
    }

    .baggagebox dl dt img {
        padding: 15px 0 0 0;
    }

    .baggagebox dl dd {
        margin: 20px 30px 0 30px;
        font-weight: bold;
    }

    .baggagebox::after {
        content: "";
        display: block;
        width: 32%;
        height: 0;
    }

    .baggagebox dl a {
        position: absolute;
        top: 0;
        left: 0;
        height:100%;
        width: 100%;
    }
    
    .baggagebox dl:hover {
        opacity: 0.8;
        background-color: #fff;
    }

    /*手荷物について end*/

    /*手荷物ページ全般 start*/

    #kome-baggage-image{
        margin-top: -25px;
    }

    /*手荷物ページ全般 end*/

    /*機内持ち込み手荷物について start*/

     #table-carryon-td{
        width: 50px;
     }

     #table-carryon-seat{
         width: 150px;
     }

    /*機内持ち込み手荷物について end*/

    /*お預けの手荷物について start*/

    #normal-list-carryon{
        text-align: left;
     }

    /*お預けの手荷物について end*/

    /*破損・未着について start*/

    #normal-list-disc-breakage{
        margin-top: 0px;
    }

    /*破損・未着について end*/

    /*制限のあるお手荷物 start*/

    #normal-list-disc-limit{
        margin-top: 0px;
    }

    #normal-list-limit{
        margin-top: 0px;
        text-align: left;
     }

    /*制限のあるお手荷物 end*/

    /*電子機器類のご使用について start*/

    #normal-list-electronics{
        text-align: left;
        vertical-align: baseline;
     }

    /*電子機器類のご使用について end*/

    /*超過手荷物 start*/    

    .tsuuka{
        text-align: right;
    }

    /*超過手荷物 end*/

    /*座席指定 start*/

    .table-top-zasekiretsu {
        background-color: #ddf4d3;
        width: 100px;
    }

    .table-top-zasekiname {
        background-color: #ddf4d3;
        width: 180px;
    }

    .table-top-netcall {
        background-color: #ddf4d3;
        width: 300px;
    }

    .table-top-tojo {
        background-color: #ddf4d3;
        width: 180px;
    }

    .tokuchou{
        text-align: left;
    }

    .tokuchou li{
        margin-bottom: 5px;
        margin-left: -15px;
        line-height: 1.4;
    }

    .tokuchou p {
        color: #ff0000;
        background: #fff2f2;
        display: inline-block;
        margin-bottom: 5px;
    }

    .tokuchou p:before {
        content: "※";
        padding-right: 0.5rem;
    }

    .normal-list .notice-use{
        list-style-type: none;
        margin-left: -40px;
    }

    /*座席指定 end*/

    /*お支払方法 start*/

    .paytipebox{
        display:flex;
    }

    table.table-paytipe-card{
        margin-right: 10px;
        margin-bottom: 5px;
        height: 120px;
        width: 185px;
        border: solid 1px #ccc;
    }

    table.table-paytipe-card th{
        padding: 20px;
    }

    table.table-paytipe-card td{
        padding: 0 10px;
    }

    table.table-paytipe-convenience{
        margin-right: 10px;
        margin-bottom: 5px;
        border: solid 1px #ccc;
    }

    table.table-paytipe-convenience th{
        padding-top: 10px;
        height: 50px;
        text-align: center;
    }

    table.table-paytipe-convenience td{
        padding: 0 10px;
        text-align: center;
    }

    .button-paytipe {
        margin: 10px 0;
        text-align: center;
    }

    .button-paytipe a {
        position: relative;
        display: inline-block;
        width: 150px;
        height: auto;
        padding: 1rem;
        text-align: center;
        font-size: 1.5rem;
        font-weight: bold;
        color: #fff !important;
        background-color: #008856;
        border-radius: 5px;
    }

    .button-paytipe a:after {
        content: "";
        position: absolute;
        top: 50%;
        bottom: 0;
        right: 3rem;
        display: flex;
        justify-content: center;
        align-items: center;
        transition: right .3s;
        width: 6px;
        height: 6px;
        border-top: solid 2px currentColor;
        border-right: solid 2px currentColor;
        transform: translateY(-50%) rotate(45deg);
    }

    .button-paytipe a:hover {
        opacity: 0.9;
    }

    .button-basic a:hover:after {
        right: 2rem;
    }

    td.table-pay {
        height: 60px;
    }

    /*お支払方法 end*/

    /*ご搭乗までの流れ start*/

    .flow-step {
        display: flex;
        margin-bottom: 20px;
        padding: 50px;
        border: 1px solid #ccc;
    }

    ul.flow-step-image {
        margin-right: 20px;
    }

    ul.flow-step-image li {
        width: 160px;
        margin-bottom: 10px;
    }

    ul.flow-step-image li img {
        width: 160px;
        vertical-align: top;
    }

    ol.notice {
        padding: 20px 50px;
        color: #f00;
        font-weight: bold;
    }

    ol.notice li,.flow-step-text ul li {
        line-height: 2;
    }

    .flow-step-text {
        flex: 1;
    }

    .flow-step-text ul {
        margin-left: 20px;;
        list-style-type: disc;
    }

    /*ご搭乗までの流れ end*/

    /*自動チェックイン機のご利用方法 start*/

    .ckeckin-image {
        display: inline-block;
        width: 410px;
        padding-right: 30px;
    }

    .ckeckin-image img {
        width: 380px;
        padding-right: 30px;
        border-right: 1px solid #ccc;
    }

    /*自動チェックイン機のご利用方法 end*/

    /*運航状況 start*/
    .flightsearch {
        width: 970px;
        display: flex;
        padding: 20px 0;
        margin: 0 auto;
        position: relative;
    }
    

    .flightsearch input {
        width: 180px;
        height: 2em;
        padding: 10px;
        margin-left: 10px;
        background-color: #fff;
        border: 1px solid #ccc;
        border-radius: 10px;
    }

    .flightsearch select {
        width: 180px;
        height: 3.5em;
        padding: 10px;
        margin-left: 10px;
        background-color: #fff;
        border: 1px solid #ccc;
        border-radius: 10px;
    }

    .flightsearch select::-ms-expand {
        display: none;
    }

    .flightsearch::before {
        position: absolute;
        top: 3em;
        left: 370px;
        width: 0;
        height: 0;
        padding: 0;
        content: '';
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        border-top: 6px solid #008856;
        pointer-events: none;
    }

    .flightsearch a {
        background-color: #008856;
        border-radius: 10px;
        width: 100px;
        height: 2.3em;
        color: #fff;
        margin: auto;
        padding: 1em 10px 0 10px;
        vertical-align: middle;
    }

    .details_distance {
        width: 670px;
        height: 20px;
        position: relative;
    }

    .circle_l {
        background-color: #008856;
        top: 4px;
        left: 0;
        width: 12px;
        height: 12px;

            display: inline-block;
            position: absolute;
            border-radius: 50%;
    }

    .details_distance .plan {
        height: 2px;
        width: 646px;
        position: absolute;
        top: 9px;
        left: 12px;
        background-color: #ccc;
    }

    .details_distance .green_plan {
        height: 2px;
        width: 0px;
        position: absolute;
        top: 9px;
        left: 12px;
        background-color: #008856;
    }

    .details_distance i {
        height: 23px;
        width: 23px;
        position: absolute;
        top: 0px;
        left: 12px;
        display: inline-block;
        background-image: url(https://media.springairlines.com/cache/style/site5/rules/images/icon_schedule_plane.png);
        z-index: 1;
    }

    .details_distance .circle_r {
        width: 11px;
        height: 11px;
        background-color: #fff;
        top: 4px;
        right: 0;
        border: 1px solid #ccc;
    }

    .details_distance .circle_r {
        width: 11px;
        height: 11px;
        background-color: #fff;
        top: 4px;
        right: 0;
        border: 1px solid #ccc;
    }

    .details_distance .circle_r {
        display: inline-block;
        position: absolute;
        border-radius: 50%;
    }

    .result-time {
        font-weight: bold;
        font-size: 2rem;
    }


    /*運航状況 end*/

    /*空港ガイド・アクセス start*/

    ul.airport-list {
        display: flex;
    }

    ul.airport-list li {
        margin: 0 10px 10px 0;
        font-weight: bold;
    }

    ul.airport-list li a {
        display: inline-block;
        padding: 1em;
        background-color: #fff;
        border: 1px solid #333;
        border-radius: 10px;
    }

    ul.airport-list li a:hover {
        display: inline-block;
        padding: 1em;
        background-color: #ddf4d3;
        border: 1px solid #44b400;
        border-radius: 10px;
    }

    /*空港ガイド・アクセス end*/

    /*安全運航へのお願い start*/

    .safebox {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .safebox dl {
        width: 32%;
        padding: 30px 0;
        margin-bottom: 20px;
        position: relative;
        border: 1px solid #ccc;
        border-radius: 10px;
        text-align: center;
        background: url(https://media.springairlines.com/cache/style/site5/rules/images/bg_safe_arrow.png) no-repeat right bottom;
    }

    .safebox dl dt {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 90px;
    }

    .safebox dl dd {
        margin: 20px 30px 0 30px;
        color: #008856;
        font-weight: bold;
    }

    .safebox::after {
        content: "";
        display: block;
        width: 32%;
        height: 0;
    }

    .safebox dl a {
        position: absolute;
        top: 0;
        left: 0;
        height:100%;
        width: 100%;
    }
    
    .safebox dl a:hover {
        opacity: 0.1;
        background-color: #fff;
    }

    .safe-article {
        display: flex;
        padding: 50px;
        border: 1px solid #ccc;
    }

    .safe-article > p {
        width: 200px;
        margin-right: 20px;
        padding-right: 20px;
        vertical-align: top;
        text-align: center;
        border-right: 1px solid #ccc;
    }

    .safe-article > div {
        flex: 1;
    }

    .safe-article ol li {
        line-height: 2;
    }

    .trouble-example {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin-top: 30px;
    }

    .trouble-example dl {
        width: 32%;
        margin-bottom: 15px;
        position: relative;
        border: 1px solid #ccc;
        text-align: center;
        background-color: #ddf4d3;
    }

    .trouble-example dl dt {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 170px;
        padding-top: 30px;
        background: url(https://media.springairlines.com/cache/style/site5/rules/images/bg_safe_ng.jpg) no-repeat left top;
        background-color: #fff;
    }

    .trouble-example dl dd {
        padding: 20px 10px;
    }

    .trouble-example::after {
        content: "";
        display: block;
        width: 32%;
        height: 0;
    }
    
    /*安全運航へのお願い end*/

    /*予約確認書印刷 start*/

    .ouro::after {
        content: "";
        display: inline-block;
        width: 15px;
        height: 15px;
        background-image:url(https://media.springairlines.com/cache/style/site5/rules/images/icon_schedule_plane.png);
        background-size: contain;
        vertical-align: middle;
        margin: 0 5px 2px 5px;
    }

    .fukuro::before {
        content: "";
        display: inline-block;
        width: 15px;
        height: 15px;
        background-image:url(https://media.springairlines.com/cache/style/site5/rules/images/icon_schedule_plane.png);
        transform: rotateZ(180deg);
        background-size: contain;
        vertical-align: middle;
        margin: 0 5px 2px 5px;
    }

    /*予約確認書印刷 end*/

    /*お問い合わせ窓口 start*/

    .contactform-box {
        width: 100%;
        margin: 50px auto;
        background-color: #f7f7f7;
        text-align: center;
    }

    .form-tab-label {
        position: relative;
        display:inline-block;
        box-sizing: border-box;
        margin: 50px 5px 0 5px;
        padding: 20px 20px 20px 50px;
        color:#333;
        background:#fff;
        text-align:center;
        font-size:1.6rem;
        cursor:pointer;
        border: 1px solid #ccc;
        border-radius: 10px;
        transition:ease 0.2s opacity;
    }

    label.form-tab-label:hover {
        opacity:0.8;
    }

    .form-tab-panel{
        width: 100%;
        padding: 50px 0;
        display: none;
    }

    .form-tab-panel p{
        font-size:14px; letter-spacing:1px; text-align:center;
    }

    #form-tab1:checked ~ .form-panel #form-tab1-content,#form-tab2:checked ~ .form-panel #form-tab2-content,#form-tab3:checked ~ .form-panel #form-tab3-content,#form-tab4:checked ~ .form-panel #form-tab4-content {
        display:block;
    }

    .form-tab-label::before {
        background: #fff;
        border: 1px solid #333;
        border-radius: 50%;
        content: '';
        display: block;
        height: 16px;
        left: 20px;
        margin-top: -8px;
        position: absolute;
        top: 50%;
        width: 16px;
    }

    .form-tab-label::after {
        background: #008856;
        border-radius: 50%;
        content: '';
        display: block;
        height: 10px;
        left: 24px;
        margin-top: -4px;
        opacity: 0;
        position: absolute;
        top: 50%;
        width: 10px;
    }
    input[type=radio]:checked + .form-tab-label::after {
        opacity: 1;
    }

    .table-form {
        width: 100%;
        margin: 0 auto;
    }

    .table-form th {
        padding: 10px 20px;
        text-align: right;
    }

    .table-form td {
        padding: 10px 0 10px 20px;
        text-align: left;
    }

    .table-form td p {
        margin-left: 10px;
    }

    input.form-size-max {
        width: 90%;
        height: 2em;
        padding: 10px;
        margin-left: 10px;
        background-color: #fff;
        border: 1px solid #ccc;
        border-radius: 10px;
    }

    input.form-size-half {
        width: 40%;
        height: 2em;
        padding: 10px;
        margin-left: 10px;
        background-color: #fff;
        border: 1px solid #ccc;
        border-radius: 10px;
    }

    input.form-size-small {
        width: 20%;
        height: 2em;
        padding: 10px;
        margin-left: 10px;
        background-color: #fff;
        border: 1px solid #ccc;
        border-radius: 10px;
    }

    input.form-size-full {
        width: 500px;
        height: 2em;
        padding: 10px;
        margin-left: 10px;
        background-color: #fff;
        border: 1px solid #ccc;
        border-radius: 10px;
    }

    .formspace {
        padding: 50px 0;
    }
    
    .table-result {
        width: 100%;
        margin: 0 auto;
        border-collapse: separate;
        border-spacing: 0 10px;
    }

    .table-result th:first-of-type,.table-result td:first-of-type {
        border-left: 1px solid #ccc;
    }

    .table-result th:last-of-type,.table-result td:last-of-type {
        border-right: 1px solid #ccc;
    }

    .table-result th {
        background-color: #ddf4d3;
        padding: 10px;
        border-top: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
    }

    .table-result td {
        padding: 20px 10px;
        border-top: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
    }

    .contact-select select {
        width: 700px;
        height: 3.5em;
        padding: 10px;
        margin-left: 10px;
        background-color: #fff;
        border: 1px solid #ccc;
        border-radius: 10px;
    }

    .contact-select select::-ms-expand {
        display: none;
    }

    .contact-select.subjects {
        position: relative;
    }

    .contact-select.subjects::before {
        position: absolute;
        top: 2.2em;
        right: 100px;
        width: 0;
        height: 0;
        padding: 0;
        content: '';
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        border-top: 6px solid #008856;
        pointer-events: none;
    }
    
    .table-form textarea {
        width: 700px;
        padding: 10px;
        margin-left: 10px;
        background-color: #fff;
        border: 1px solid #ccc;
        border-radius: 10px;
    }
    .faq-box textarea{
        width: 700px;
        padding: 10px;
        margin-left: 0;
        background-color: #fff;
        box-sizing: border-box;
        border: 3px solid #008856;
        border-radius: 10px;
    }

    .privacy-checkbox {
        box-sizing: border-box;
        cursor: pointer;
        display: inline-block;
        padding: 20px 30px;
        position: relative;
        width: auto;
    }

    .privacy-checkbox::before {
        background: #fff;
        border: 1px solid #333;
        content: '';
        display: block;
        height: 16px;
        left: 5px;
        margin-top: -8px;
        position: absolute;
        top: 50%;
        width: 16px;
    }
    
    .privacy-checkbox::after {
        border-right: 3px solid #008856;
        border-bottom: 3px solid #008856;
        content: '';
        display: block;
        height: 9px;
        left: 10px;
        margin-top: -7px;
        opacity: 0;
        position: absolute;
        top: 50%;
        transform: rotate(45deg);
        width: 5px;
    }

    input[type=checkbox]:checked + .privacy-checkbox::after {
        opacity: 1;
    }

    .callcenter {
        margin: 30px 0;
        padding: 30px;
        border: 1px solid #ccc;
    }

    .callcenter h4 {
        margin-bottom: 20px;
        font-size: 1.6rem;
        font-weight: bold;
    }

    .callcenter-ij::before {
        content: "";
        display: inline-block;
        width: 30px;
        height: 28px;
        background-image:url(https://media.springairlines.com/cache/style/site5/rules/images/wingij.svg);
        background-size: contain;
        vertical-align: middle;
        margin: 0 7px 2px 0;
    }

    .callcenter-9c::before {
        content: "";
        display: inline-block;
        width: 30px;
        height: 28px;
        background-image:url(https://media.springairlines.com/cache/style/site5/rules/images/wing9c.svg);
        background-size: contain;
        vertical-align: middle;
        margin: 0 7px 2px 0;
    }

    .callcenter h5 {
        padding-bottom: 5px;
        font-size: 1.6rem;
        font-weight: bold;
    }

    .callcenter .telfax {
        line-height: 0;
        padding: 20px 0;
        font-weight: bold;
    }

    .callcenter .telfax img {
        vertical-align: middle;
        margin-right: 10px;
    }

    .callcenter .telfax span {
        font-size: 3.6rem;
    }

    .callcenter .kome {
        margin: 0 0 10px 0;
    }

    .button_contentcheck{
        margin: 50px 0;
        text-align: center;
    }

    .button_contentcheck input{
        display: none;
    }

    .button_contentcheck a {
        position: relative;
        display: inline-block;
        width: 500px;
        height: auto;
        padding: 2rem 0;
        text-align: center;
        font-size: 2rem;
        font-weight: bold;
        color: #fff;
        background-color: #008856;
        border-radius: 5px;
        font-style: normal;
        text-decoration: none;
    }

    .button_contentcheck a:after {
        content: "";
        position: absolute;
        top: 50%;
        bottom: 0;
        right: 3rem;
        display: flex;
        justify-content: center;
        align-items: center;
        transition: right .3s;
        width: 6px;
        height: 6px;
        border-top: solid 2px currentColor;
        border-right: solid 2px currentColor;
        transform: translateY(-50%) rotate(45deg);
    }

    .button_contentcheck a:hover {
        opacity: 0.9;
    }

    .button_contentcheck a:hover:after {
        right: 2rem;
    }

    #content_reserved, #content_nonreserved, #content_reserved9c, #content_nonreserved9c{
        display: none;
    }

    .popup_content_reserved, .popup_content_nonreserved, .popup_content_reserved9c, .popup_content_nonreserved9c{
        display: none;
        position: fixed;
        top: 15%;
        left: 15%;
        align-self: center;
        width: 70%;
        max-height: 70%;
        overflow-y: auto;
        padding: 30px 30px 15px 30px;
        box-sizing: border-box;
        background: #fff;
        line-height: 1.4em;
        transition: 0.5s;
    }

    #content_reserved:checked ~ .popup_content_reserved, #content_nonreserved:checked ~ .popup_content_nonreserved, #content_reserved9c:checked ~ .popup_content_reserved9c, #content_nonreserved9c:checked ~ .popup_content_nonreserved9c{
        display: block;
    }

    .popup_content_reserved h3, .popup_content_nonreserved h3, .popup_content_reserved9c h3, .popup_content_nonreserved9c h3{
        padding: 0 0 5px 0;
        font-size: 2.4rem;
        font-weight: bold;
        text-align: center;
        border-bottom: 1px solid #ccc;
    }

    .popup_content_reserved h4, .popup_content_nonreserved h4, .popup_content_reserved9c h4, .popup_content_nonreserved9c h4{
        margin: 10px 0 20px 0; 
    }
    
    .popup_content_reserved h5, .popup_content_nonreserved h5, .popup_content_reserved9c h5, .popup_content_nonreserved9c h5{
        margin: 5px 0 10px 0; 
    }

    .popup_content_reserved p, .popup_content_nonreserved p, .popup_content_reserved9c p, .popup_content_nonreserved9c p{
        text-align: left;
    }

    .table_content_reserved{
        width: 35%;
    }

    .table_content_nonreserved{
        width: 35%;
    }

    .table_content_reserved p, .table_content_nonreserved p{
        text-align: right;
    }
  
    .syuusei{
        margin-top: -20px;
        margin-bottom: -30px;
    }

    /*お問い合わせ窓口 end*/
    

    /*ご搭乗サポート start*/

    .subtitle-support{
        font-weight: bold;
        font-size: 20px;
        margin: 30px 0px 10px 0px;
    }

    .helpbox {
        display: flex;
        flex-wrap: wrap;
    }

    .helpbox dl {
        width: 240px;
        padding: 0 0 20px 0;
        margin-bottom: 20px;
        margin-right: 20px;
        position: relative;
        border: 1px solid #ccc;
        border-radius: 10px;
        text-align: center;
    }

    .helpbox dl dt {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 160px;
        background-color: #ddf4d3;
        border-radius: 10px 10px 0 0;
    }

    .helpbox dl dt img {
        padding: 15px 0 0 0;
    }

    .helpbox dl dd {
        margin: 20px 30px 0 30px;
        font-weight: bold;
    }

    .helpbox::after {
        content: "";
        display: block;
        width: 32%;
        height: 0;
    }

    .helpbox dl a {
        position: absolute;
        top: 0;
        left: 0;
        height:100%;
        width: 100%;
    }
    
    .helpbox dl:hover {
        opacity: 0.8;
        background-color: #fff;
    }

    #normal-list-help{
        margin-top: 0px;
        text-align: left;
     }

    table.table-help {
        width: 90%;
        text-align: center;
        margin-bottom: 60px;
    }

    .table-help td {
        padding: 10px;
    }

    .table-help td p{
        text-align: left;
    }
    
    /*ご搭乗サポート end */

    /*ご妊娠中のお客さま start*/

    #ninshin-weeks{
        width: 70px;
    }

    #ninshin-days{
        width: 100px;
    }

    #ninshin-boarding{
        width: 150px;
    }
 
    .list-ninshin p {
         text-align: left;
     }


    /*ご妊娠中のお客さま end */

    /*パスワードを忘れた方 start*/

    .table-password-flow th {
        width: 175px;
    }

    .table-password-flow td {
        padding: 10px 0;
    }

    .table-password-flow p {
        line-height: 1.4;
    }

    .bg-password {
        background: url(https://media.springairlines.com/cache/style/site5/rules/images/bg_password_flow.jpg) no-repeat center;
    }
    /*パスワードを忘れた方 end*/

    /*メールマガジン設定 start*/

    .edm-flow {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    /*メールマガジン設定 end*/

    /*よくあるご質問 start*/
      
    .faq-search {
        width: 700px;
        position: relative;
        margin-left: auto;
        margin-right: auto;    
        display: flex;
        flex-wrap: wrap;
    }

    .faq-search-input {
        border: 3px solid #008856;
        border-radius: 5px;
        width: 100%;
        height: 55px;
        letter-spacing: 0.1em;
        padding-left: 20px;
        padding-right: 55px;
        background: #fff;
        color: #333;
    }

    .faq-search-btn {
        position: absolute;
        top: 0;
        right: 0;
        width: 120px;
        height: 55px;
        line-height: 55px;
        padding: 0;
        border: none;
        border-radius: 0 5px 5px 0;
        background: #008856;
        color: #fff;
    }
 
    .faq-search-icon {
        margin: 0 10px 0 auto;
        width: 30px;
        height: auto;
        vertical-align: middle;
    }

    .faq-select {
        width: 700px;
        height: 3.5em;
        margin: 0 auto;
    }

    .faq-select select {
        width: 700px;
        height: 3.5em;
        padding: 10px;
        background-color: #fff;
        border: 3px solid #008856;
        border-radius: 5px;
    }

    .faq-select select::-ms-expand {
        display: none;
    }

    .faq-select.subjects {
        position: relative;
    }

    .faq-select.subjects::before {
        position: absolute;
        top: 1.7em;
        right: 30px;
        width: 0;
        height: 0;
        padding: 0;
        content: '';
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        border-top: 6px solid #008856;
        pointer-events: none;
    }
    
    

    /*よくあるご質問 end*/

/*contents end*/

/*footer start*/

    #footer-box {
        width: 100%;
        height: auto;
        border-top: 5px solid #008856;
    }

    #footer-box-menu {
        width: 1200px;
        height: auto;
        margin: 40px auto;
        display: flex;
        align-items: flex-start;
    }

    #footer-box-menu dl {
        width: 100%;
        margin-right: 10px;
    }

    #footer-box-menu dl dt {
        margin-bottom: 20px;
        padding-bottom: 10px;
        font-size: 15px;
        color: #008856;
        font-weight: bold;
        border-bottom: 2px solid #008856;
    }

    #footer-box-menu dl dd {
        font-size: 13px;
    }

    #footer-box-menu dl dd ul li {
        margin-left: 5px;
        line-height: 2.5;
    }

    #footer-box-menu dl dd ul.icon-internal li a::before {
        content: "";
        display: inline-block;
        width: 7px;
        height: 12px;
        background-image:url(https://media.springairlines.com/cache/style/site5/rules/images/linkarrow.svg);
        background-size: contain;
        background-repeat: no-repeat;
        vertical-align: middle;
        margin: 0 7px 2px 0;
    }

    #footer-box-menu dl dd ul.icon-external li a::after {
        content: "";
        display: inline-block;
        width: 12px;
        height: 12px;
        background-image:url(https://media.springairlines.com/cache/style/site5/rules/images/linkexternal.svg);
        background-size: contain;
        background-repeat: no-repeat;
        vertical-align: middle;
        margin: 0 0 2px 7px;
    }

    #footer-box-menu dl dd ul li a:hover {
        color: #008856;
    }

    #footer-box-info {
        width: 100%;
        height: auto;
        padding: 30px 0;
        background-color: #008856;
        text-align: center;
    }

    #footer-box-info img{
        filter: invert(100%) saturate(0%) brightness(200%);
    }

    #footer-box-info img {
        width: 450px;
        height: auto;
    }

    #footer-box-copyright {
        width: 100%;
        height: auto;
        background-color: #008856;
        padding: 50px 0;
    }

    #footer-box-copyright ul {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    #footer-box-copyright ul li {
        padding: 0 25px;
    }

    #footer-box-copyright p {
        margin-top: 30px;
        text-align: center;
        color: #fff;
    }
    
    .loding{
        position: fixed;
        left: 50%;
        top: 50%;
        transform: translate(-50%,-50%);
        width: 100%;
        height: 100%;
        background: rgba(0,0,0,0.6);
        z-index: 9999;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    dl.introduction dt {
        float: left;
    }

    .introdtimg { 
        width: 220px; 
        padding: 5px; 
        border: 1px solid #e9e9e9; 
    }
    /* 新加的 */
    .confirm-box{
        display: none;
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        align-self: center;
        width: 70%;
        max-height: 70%;
        overflow-y: auto;
        padding: 30px 30px 15px 30px;
        box-sizing: border-box;
        background: #fff;
        line-height: 1.4em;
        transition: 0.5s;
        text-align: center;
        z-index: 555;
        border: 1px solid #999;
    }
    .confirm-box h2{
        padding: 0 0 5px 0;
        font-size: 1.8em;
        font-weight: bold;
        text-align: center;
        border-bottom: 1px solid #ccc;
        color: #333 !important;
    }
    .confirm-box h4{
        margin: 10px 0 20px 0;
        font-weight: 700;
        font-size: 14px;
    }
    .confirm-box h5{
        margin: 5px 0 10px 0;
    }
    .confirm-box p{
        padding: 0;
        margin: 0;
        height: auto !important;
    }
    .confirm-box table{
        width: 100%;
        text-align: center;
        text-align: left;
        margin-top: 25px;
    }
    .confirm-box th{
        padding: 10px 15px;
        border: solid 1px#ccc;
        font-weight: normal;
    }
    .confirm-box th p {
        line-height: 1.4;
        word-break: break-word;
    }
    .syuusei{
        text-align: left;
        margin: 15px 0 10px !important;
        text-decoration: underline;
        color: #008856;
    }
    .submitBtn :after{
        content: "";
        position: absolute;
        top: 50%;
        bottom: 0;
        right: 3rem;
        display: flex;
        justify-content: center;
        align-items: center;
        transition: right .3s;
        width: 6px;
        height: 6px;
        border-top: solid 2px currentColor;
        border-right: solid 2px currentColor;
        transform: translateY(-50%) rotate(45deg);
    }
    .submitBtn{
        position: relative;
        display: block;
        margin-bottom: 10px;
        width: 100%;
        height: auto;
        padding: 15px 0;
        text-align: center;
        font-size: 2rem;
        font-weight: bold;
        color: #fff !important;
        background-color: #008856;
        border-radius: 5px;
    }
    .submitBtn a{
        color:#fff !important;
        display: block;
    }
    .submitBtn:hover {
        opacity: 0.9;
    }
    .submitBtn:hover :after {
        right: 2rem;
    }
/*footer end*/