a { color: #0069c3; text-decoration: none; } @media screen and (max-width: 480px) { #app button { padding: 0; background: inherit; } } .ar-search select { -webkit-appearance: none;/* ベンダープレフィックス(Google Chrome、Safari用) */ -moz-appearance: none; /* ベンダープレフィックス(Firefox用) */ appearance: none; /* 標準のスタイルを無効にする */ } .search-btn button { border-style: none; } .items input { line-height: 100%; } @media screen and (max-width: 480px) { .info-banner.show-sp { display: block; } } .info-banner { width: 100%; margin: 0 auto; } @media screen and (min-width: 976px) { .info-banner { width: auto; margin: 0; } } .info-banner img { width: 100%; height: auto; } /****** 検索フォームの切り替えタブ ******/ .tab-area { display: flex; -webkit-justify-content: space-between; justify-content: space-between; padding: 1vw 0 0; } .tab-area .tab { width: 50%; line-height: 2.5; text-align: center; font-size: 1.8rem; font-weight: 600; border-radius: 5px 5px 0 0; } .tab-area .tab.tab-bkcolor-airticket { color: #4277e6; background-color: #fff; cursor: pointer; } .tab-area .tab.tab-bkcolor-airticket a { position: relative; display: block; width: 100%; padding-left: 15%; line-height: inherit; color: #204793; border-radius: 5px 5px 0 0; text-decoration: none; } .tab-area .tab.tab-bkcolor-airticket a::before { content: ""; display: inline-block; position: absolute; top: 50%; left: 5%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); width: 6vw; height: 6vw; background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_52_1559)%22%3E%3Cpath%20d%3D%22M26.0225%202.21865C23.6855%204.43108%2022.0381%206.14415%2021.3873%206.83269C21.1965%207.03481%2020.9091%207.1139%2020.6419%207.03739L16.6068%205.88828L17.7549%204.74019C18.0712%204.42384%2018.0712%203.91054%2017.7549%203.59366L16.8177%202.65649C16.5013%202.34013%2015.988%202.34013%2015.6712%202.65649L13.3626%204.96506L3.85072%202.25639C3.41444%202.13233%202.94508%202.2538%202.62407%202.57481L2.01255%203.18633C1.92209%203.27679%201.93915%203.42722%202.04719%203.49545L13.6076%2010.7804C13.7125%2010.8466%2013.8066%2010.9272%2013.8883%2011.0203L15.1589%2012.4764C15.3176%2012.6584%2015.3103%2012.9324%2015.1418%2013.1055C14.0449%2014.234%2010.2047%2018.2261%208.29108%2020.7658L1.41603%2019.7614C1.16635%2019.7247%200.91358%2019.8084%200.735242%2019.9873L0.0606599%2020.6619C-0.0344536%2020.757%20-0.0168783%2020.9157%200.0968443%2020.9881L5.6553%2024.5186C5.79642%2024.6081%205.82898%2024.7998%205.72508%2024.9311C5.2614%2025.5168%204.58992%2026.5682%204.23428%2027.7644C5.43095%2027.4087%206.48237%2026.7373%207.06752%2026.2736C7.1983%2026.1697%207.3906%2026.2022%207.48003%2026.3434L11.0106%2031.9018C11.083%2032.0155%2011.2417%2032.0331%2011.3368%2031.938L12.0114%2031.2634C12.1897%2031.0851%2012.2734%2030.8323%2012.2373%2030.5826L11.2329%2023.7076C13.773%2021.7939%2017.7652%2017.9537%2018.8931%2016.8568C19.0663%2016.6883%2019.3403%2016.6811%2019.5222%2016.8398L20.9784%2018.1104C21.0714%2018.1915%2021.1526%2018.2861%2021.2182%2018.391L28.5032%2029.9515C28.5714%2030.0595%2028.7219%2030.0766%2028.8123%2029.9861L29.4238%2029.3746C29.7448%2029.0536%2029.8663%2028.5842%2029.7423%2028.1479L27.0341%2018.6366L29.3427%2016.328C29.659%2016.0117%2029.659%2015.4984%2029.3427%2015.1815L28.4055%2014.2443C28.0892%2013.9279%2027.5758%2013.9279%2027.259%2014.2443L26.1109%2015.3924L24.9618%2011.3573C24.8858%2011.0901%2024.9644%2010.8026%2025.1665%2010.6119C25.855%209.96161%2027.5681%208.31367%2029.7805%205.97667C32.6815%202.9134%2031.9056%200.0946247%2031.9056%200.0946247C31.9056%200.0946247%2029.0868%20-0.681791%2026.0225%202.21917V2.21865Z%22%20fill%3D%22%23204793%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_52_1559%22%3E%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E'); background-size: contain; background-repeat: no-repeat; } .tab-area .tab.tab-bkcolor-airticket a:hover { text-decoration: none; } .tab-area .tab.tab-bkcolor-airticket a:active { opacity: 0.7; text-decoration: none; } .tab-area .tab.tab-bkcolor-rentacar { position: relative; padding-left: 6%; color: #0C8953; background-color: #fff; } .tab-area .tab.tab-bkcolor-rentacar::before { content: ""; display: inline-block; position: absolute; top: 50%; left: 10%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); width: 6vw; height: 6vw; background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_52_1126)%22%3E%3Cpath%20d%3D%22M0.00273705%2013.2321C0.00273705%2012.9062%200.113764%2012.4671%200.806273%2012.4671H3.28658C3.55564%2012.4671%203.74487%2012.6307%203.87049%2012.8067L6.03838%209.15842C6.27219%208.76534%206.55543%208.4054%206.88122%208.08812C7.83064%207.16444%209.09125%207%2010.4017%207H20.5985C21.9089%207%2023.1696%207.16444%2024.1186%208.08812C24.4444%208.4054%2024.728%208.76534%2024.9614%209.15842L27.1293%2012.8067C27.2549%2012.6307%2027.4442%2012.4671%2027.7132%2012.4671H30.1939C30.8868%2012.4671%2030.9975%2012.9062%2030.9975%2013.2321C30.9975%2013.5581%2031.0007%2014.0154%2031.0003%2014.0734C30.9987%2014.2714%2030.9367%2014.7871%2030.3325%2014.8045C29.7859%2014.8198%2028.8069%2014.8127%2028.3186%2014.8078L28.6724%2015.4034C28.9698%2015.8835%2029.2275%2016.3884%2029.4419%2016.9128C29.9472%2018.1479%2030.2073%2019.473%2030.2073%2020.8117V29.2027C30.2073%2029.643%2029.858%2030%2029.4273%2030H26.1633C25.7325%2030%2025.3832%2029.643%2025.3832%2029.2027V27.3408H5.61696V29.2027C5.61696%2029.643%205.26767%2030%204.83693%2030H1.57253C1.14179%2030%200.792496%2029.643%200.792496%2029.2027V26.3409V20.8117C0.792496%2019.473%201.05264%2018.1475%201.55794%2016.9128C1.7723%2016.3884%202.03002%2015.8835%202.32744%2015.4034L2.68119%2014.8078C2.19291%2014.8127%201.21392%2014.8198%200.667284%2014.8045C0.0631123%2014.7875%200.0011158%2014.2718%20-0.000505447%2014.0734C-0.000911713%2014.0154%200.00233078%2013.5722%200.00233078%2013.2321H0.00273705ZM21.93%2020.3445L22.9645%2021.2259C23.3017%2021.5129%2023.745%2021.6728%2024.2053%2021.6728H26.5012C26.8983%2021.6728%2027.291%2021.5908%2027.6472%2021.4293C28.1873%2021.184%2028.7388%2020.8436%2028.8065%2020.5487C28.9009%2020.1365%2028.7392%2019.1781%2028.6683%2019.0045C28.5974%2018.8309%2028.4317%2018.4188%2027.9827%2018.5058C27.618%2018.5762%2023.5788%2019.5036%2022.0686%2019.8507C21.8251%2019.9066%2021.7465%2020.1879%2021.9304%2020.3445H21.93ZM26.3801%2015.1582C26.3801%2015.1582%2027.3258%2015.2307%2026.6876%2014.1914C26.2301%2013.4467%2024.9116%2011.2758%2024.2%2010.1041C23.8998%209.60908%2023.533%209.15925%2023.1084%208.77156C22.7562%208.45055%2022.424%208.22853%2021.6273%208.19664C20.4214%208.14818%2015.5009%208.19664%2015.5009%208.19664C15.5009%208.19664%2010.5804%208.14818%209.3745%208.19664C8.57785%208.22853%208.24517%208.45055%207.89345%208.77156C7.46838%209.15925%207.10206%209.60949%206.8018%2010.1041C6.09025%2011.2758%204.77128%2013.4467%204.3142%2014.1914C3.67558%2015.2307%204.62176%2015.1582%204.62176%2015.1582H26.3801ZM2.3323%2019.0049C2.26139%2019.1785%202.09971%2020.1369%202.19413%2020.5491C2.2618%2020.8436%202.81329%2021.1845%203.35344%2021.4297C3.70962%2021.5912%204.10227%2021.6732%204.49938%2021.6732H6.79532C7.25564%2021.6732%207.69854%2021.5138%208.03608%2021.2263L9.07059%2020.3449C9.25455%2020.1883%209.17595%2019.9071%208.93241%2019.8511C7.42218%2019.504%203.38262%2018.5766%203.01833%2018.5062C2.56895%2018.4196%202.40362%2018.8318%202.33271%2019.0049H2.3323Z%22%20fill%3D%22%230C8953%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_52_1126%22%3E%3Crect%20width%3D%2231%22%20height%3D%2223%22%20fill%3D%22white%22%20transform%3D%22matrix(-1%200%200%201%2031%207)%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E'); background-size: contain; background-repeat: no-repeat; } .tab-area .tab.active { color: #fff; border: none; } .tab-area .tab-bkcolor-airticket.active { position: relative; background-color: #4277e6; } .tab-area .tab-bkcolor-airticket.active::before { content: ""; display: inline-block; position: absolute; top: 50%; left: 8%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); width: 32px; height: 32px; background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_52_1559)%22%3E%3Cpath%20d%3D%22M26.0225%202.21865C23.6855%204.43108%2022.0381%206.14415%2021.3873%206.83269C21.1965%207.03481%2020.9091%207.1139%2020.6419%207.03739L16.6068%205.88828L17.7549%204.74019C18.0712%204.42384%2018.0712%203.91054%2017.7549%203.59366L16.8177%202.65649C16.5013%202.34013%2015.988%202.34013%2015.6712%202.65649L13.3626%204.96506L3.85072%202.25639C3.41444%202.13233%202.94508%202.2538%202.62407%202.57481L2.01255%203.18633C1.92209%203.27679%201.93915%203.42722%202.04719%203.49545L13.6076%2010.7804C13.7125%2010.8466%2013.8066%2010.9272%2013.8883%2011.0203L15.1589%2012.4764C15.3176%2012.6584%2015.3103%2012.9324%2015.1418%2013.1055C14.0449%2014.234%2010.2047%2018.2261%208.29108%2020.7658L1.41603%2019.7614C1.16635%2019.7247%200.91358%2019.8084%200.735242%2019.9873L0.0606599%2020.6619C-0.0344536%2020.757%20-0.0168783%2020.9157%200.0968443%2020.9881L5.6553%2024.5186C5.79642%2024.6081%205.82898%2024.7998%205.72508%2024.9311C5.2614%2025.5168%204.58992%2026.5682%204.23428%2027.7644C5.43095%2027.4087%206.48237%2026.7373%207.06752%2026.2736C7.1983%2026.1697%207.3906%2026.2022%207.48003%2026.3434L11.0106%2031.9018C11.083%2032.0155%2011.2417%2032.0331%2011.3368%2031.938L12.0114%2031.2634C12.1897%2031.0851%2012.2734%2030.8323%2012.2373%2030.5826L11.2329%2023.7076C13.773%2021.7939%2017.7652%2017.9537%2018.8931%2016.8568C19.0663%2016.6883%2019.3403%2016.6811%2019.5222%2016.8398L20.9784%2018.1104C21.0714%2018.1915%2021.1526%2018.2861%2021.2182%2018.391L28.5032%2029.9515C28.5714%2030.0595%2028.7219%2030.0766%2028.8123%2029.9861L29.4238%2029.3746C29.7448%2029.0536%2029.8663%2028.5842%2029.7423%2028.1479L27.0341%2018.6366L29.3427%2016.328C29.659%2016.0117%2029.659%2015.4984%2029.3427%2015.1815L28.4055%2014.2443C28.0892%2013.9279%2027.5758%2013.9279%2027.259%2014.2443L26.1109%2015.3924L24.9618%2011.3573C24.8858%2011.0901%2024.9644%2010.8026%2025.1665%2010.6119C25.855%209.96161%2027.5681%208.31367%2029.7805%205.97667C32.6815%202.9134%2031.9056%200.0946247%2031.9056%200.0946247C31.9056%200.0946247%2029.0868%20-0.681791%2026.0225%202.21917V2.21865Z%22%20fill%3D%22%23fff%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_52_1559%22%3E%3Crect%20width%3D%2232%22%20height%3D%2232%22%20fill%3D%22white%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E'); background-size: contain; background-repeat: no-repeat; } .tab-area .tab-bkcolor-rentacar.active { position: relative; background-color: #00a8e8; } .tab-area .tab-bkcolor-rentacar.active::before { content: ""; display: inline-block; position: absolute; top: 50%; left: 5%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); width: 6vw; height: 6vw; background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2232%22%20height%3D%2232%22%20viewBox%3D%220%200%2032%2032%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20clip-path%3D%22url(%23clip0_52_1126)%22%3E%3Cpath%20d%3D%22M0.00273705%2013.2321C0.00273705%2012.9062%200.113764%2012.4671%200.806273%2012.4671H3.28658C3.55564%2012.4671%203.74487%2012.6307%203.87049%2012.8067L6.03838%209.15842C6.27219%208.76534%206.55543%208.4054%206.88122%208.08812C7.83064%207.16444%209.09125%207%2010.4017%207H20.5985C21.9089%207%2023.1696%207.16444%2024.1186%208.08812C24.4444%208.4054%2024.728%208.76534%2024.9614%209.15842L27.1293%2012.8067C27.2549%2012.6307%2027.4442%2012.4671%2027.7132%2012.4671H30.1939C30.8868%2012.4671%2030.9975%2012.9062%2030.9975%2013.2321C30.9975%2013.5581%2031.0007%2014.0154%2031.0003%2014.0734C30.9987%2014.2714%2030.9367%2014.7871%2030.3325%2014.8045C29.7859%2014.8198%2028.8069%2014.8127%2028.3186%2014.8078L28.6724%2015.4034C28.9698%2015.8835%2029.2275%2016.3884%2029.4419%2016.9128C29.9472%2018.1479%2030.2073%2019.473%2030.2073%2020.8117V29.2027C30.2073%2029.643%2029.858%2030%2029.4273%2030H26.1633C25.7325%2030%2025.3832%2029.643%2025.3832%2029.2027V27.3408H5.61696V29.2027C5.61696%2029.643%205.26767%2030%204.83693%2030H1.57253C1.14179%2030%200.792496%2029.643%200.792496%2029.2027V26.3409V20.8117C0.792496%2019.473%201.05264%2018.1475%201.55794%2016.9128C1.7723%2016.3884%202.03002%2015.8835%202.32744%2015.4034L2.68119%2014.8078C2.19291%2014.8127%201.21392%2014.8198%200.667284%2014.8045C0.0631123%2014.7875%200.0011158%2014.2718%20-0.000505447%2014.0734C-0.000911713%2014.0154%200.00233078%2013.5722%200.00233078%2013.2321H0.00273705ZM21.93%2020.3445L22.9645%2021.2259C23.3017%2021.5129%2023.745%2021.6728%2024.2053%2021.6728H26.5012C26.8983%2021.6728%2027.291%2021.5908%2027.6472%2021.4293C28.1873%2021.184%2028.7388%2020.8436%2028.8065%2020.5487C28.9009%2020.1365%2028.7392%2019.1781%2028.6683%2019.0045C28.5974%2018.8309%2028.4317%2018.4188%2027.9827%2018.5058C27.618%2018.5762%2023.5788%2019.5036%2022.0686%2019.8507C21.8251%2019.9066%2021.7465%2020.1879%2021.9304%2020.3445H21.93ZM26.3801%2015.1582C26.3801%2015.1582%2027.3258%2015.2307%2026.6876%2014.1914C26.2301%2013.4467%2024.9116%2011.2758%2024.2%2010.1041C23.8998%209.60908%2023.533%209.15925%2023.1084%208.77156C22.7562%208.45055%2022.424%208.22853%2021.6273%208.19664C20.4214%208.14818%2015.5009%208.19664%2015.5009%208.19664C15.5009%208.19664%2010.5804%208.14818%209.3745%208.19664C8.57785%208.22853%208.24517%208.45055%207.89345%208.77156C7.46838%209.15925%207.10206%209.60949%206.8018%2010.1041C6.09025%2011.2758%204.77128%2013.4467%204.3142%2014.1914C3.67558%2015.2307%204.62176%2015.1582%204.62176%2015.1582H26.3801ZM2.3323%2019.0049C2.26139%2019.1785%202.09971%2020.1369%202.19413%2020.5491C2.2618%2020.8436%202.81329%2021.1845%203.35344%2021.4297C3.70962%2021.5912%204.10227%2021.6732%204.49938%2021.6732H6.79532C7.25564%2021.6732%207.69854%2021.5138%208.03608%2021.2263L9.07059%2020.3449C9.25455%2020.1883%209.17595%2019.9071%208.93241%2019.8511C7.42218%2019.504%203.38262%2018.5766%203.01833%2018.5062C2.56895%2018.4196%202.40362%2018.8318%202.33271%2019.0049H2.3323Z%22%20fill%3D%22white%22%2F%3E%3C%2Fg%3E%3Cdefs%3E%3CclipPath%20id%3D%22clip0_52_1126%22%3E%3Crect%20width%3D%2231%22%20height%3D%2223%22%20fill%3D%22white%22%20transform%3D%22matrix(-1%200%200%201%2031%207)%22%2F%3E%3C%2FclipPath%3E%3C%2Fdefs%3E%3C%2Fsvg%3E'); background-size: contain; background-repeat: no-repeat; } .tab-area .tab.tab-bkcolor-hire a { color: #2f2e2e; background-color: #fff; cursor: pointer; } .tab-area .tab.tab-bkcolor-hire a { position: relative; display: block; width: 100%; padding-left: 10%; line-height: inherit; color: #2f2e2e; border-radius: 5px 5px 0 0; text-decoration: none; } .tab-area .tab-bkcolor-hire a::before { content: ""; display: inline-block; position: absolute; top: 50%; left: 5%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); width: 6vw; height: 6vw; background-image: url('/img/sp2/top/icon_hire_black.svg'); background-size: contain; background-repeat: no-repeat; } #lookfor { width: 900px; /* height: 643px; */ padding: 3vw 0 0; margin: 0 auto; } @media screen and (max-width: 975px) { #lookfor { width: 100%; padding: 2.8vw 1vw 0; } } @media screen and (max-width: 480px) { #lookfor { padding: 6vw 1vw 0; height: auto; } #lookfor h2::after { content: none; } #lookfor h2 .show-sp { display: block; } } #lookfor .major_tab_list { margin: 1.5vw 1vw 0; } @media screen and (max-width: 480px) { #lookfor .show-pc { display: none; } #lookfor .show-sp { display: block; padding: 6vw 0 0; } } .major_tab_list ul { list-style: none } .major_tab_list__tab { display: flex; padding-bottom: 1px; border-bottom: solid 2px #00a8e8; } .major_tab_list__tab li { background-color: #4dc1f1; color: #ffffff; margin-right: 5px; width: 160px; padding: 10px 0; text-align: center; font-weight: bold; border-top-left-radius: 5px; border-top-right-radius: 5px } .major_tab_list__tab li.current { background-color: #00a8e8; } .major_tab_list__tab li:hover { cursor: pointer } .major_tab_list__tab li:last-child { margin-right: 0 } .major_tab_list__tab li:hover { cursor: pointer } .major_tab_list__tab li:last-child { margin-right: 0 } .major_tab_list__table { margin-top: 10px } .major_tab_list__table th { width: 150px; background-color: #4dc1f1; padding: 10px 15px; color: #ffffff; border-bottom: solid 1px #dcdcdc; text-align: center; letter-spacing: 0 } .major_tab_list__table td { width: 84%; padding: 10px 15px; border-bottom: solid 1px #dcdcdc; } .major_tab_list__table td ul li { float: left; line-height: 150% } .major_tab_list__table td ul li:after { content: "|"; padding-left: 10px; padding-right: 10px } .major_tab_list__table td ul li:last-child:after { content: ""; padding: 0 } .major_tab_list__table tr:last-child th, .major_tab_list__table tr:last-child td { border-bottom: none } .area table { display: none } .area table.show { display: block } .area table { display: none } .area table.show { display: block } #plan-banner { width: 100%; margin: 0 auto; } @media screen and (max-width: 480px) { #plan-banner.show-pc { display: none; } #plan-banner.show-sp { display: block; } } #plan-banner img { width: 100%; height: auto; } .basewid h2 { color: #fff; font-size: 24px; font-weight: bold; text-align: center; padding: 12px 0; background: #00a8e8; } @media screen and (min-width: 976px) { .basewid h2 { } } .basewid .wrap { display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; } .ac { width: 98%; max-width: 600px; margin: 0 auto; } /********* 上層メニュー *********/ .ac-parent { position: relative; margin: 0 0 1.5vw; text-align: center; line-height: 2.5; color: #fff; font-size: 1.9rem; font-weight: bold; background-color: #4dc1f1; cursor: pointer; transition: .3s; } /* 上層メニューアイコン */ /* 十字横線 */ /* .ac-parent:before { content: ""; position: absolute; top: 50%; right: 8px; transform: translateY(-50%); width: 24px; height: 2px; background: #fff; } */ /* 十字縦線 */ /* .ac-parent:after { content: ""; position: absolute; top: 50%; right: 19px; transform: translateY(-50%); transition: all .3s; width: 2px; height: 24px; background: #fff; } */ .ac-parent:after { content: ""; position: absolute; top: 36%; right: 16px; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); display: block; width: 12px; height: 12px; border-top: solid 2px #fff; border-right: solid 2px #fff; transform: rotate(-225deg); transition: all .3s; } /* アイコン変化（openクラスを付与）※縦線（after）だけ縦回転させる */ /* .ac-parent.open:after { top: 25%; transform: rotate(90deg); opacity: 0; } */ .ac-parent.open:after { top: 50%; transform: rotate(-45deg); } /********* 下層メニュー *********/ .ac-child__item { position: relative; padding: 1em; background-color: #F6F6F6; border-bottom: 1px solid #4B4B4B; cursor: pointer; } /* 下層メニューアイコン */ .ac-child__item:after { content: ""; position: absolute; top: 40%; right: 16px; transform: translateY(-50%); display: block; width: 8px; height: 8px; border-top: solid 2px #333; border-right: solid 2px #333; transform: rotate(-225deg); transition: all .3s; } /* 下層アイコン変化（openクラスを付与） */ .ac-child__item.open:after { top: 45%; transform: rotate(-45deg); } /* 下層メニュー内テキストエリア */ .ac-child__description { background-color: #fff; } .ac-child__description a:hover { opacity: 0.7; text-decoration: none; } .ac-child__description div { position: relative; width: 96%; margin: 0 auto; } .ac-child__description div:not(:last-child) { border-bottom: 1px solid #4B4B4B; } .ac-child__description div::after { content: ""; position: absolute; top: 40%; right: 16px; transform: translateY(-50%); display: block; width: 8px; height: 8px; border-top: solid 2px #333; border-right: solid 2px #333; transform: rotate(45deg); } .ac-child__description div a { display: block; padding: 1em; line-height: 1.3; } /* コンテンツ */ #popularity { width: 900px; padding: 3vw 0 0; margin: 0 auto; } @media screen and (max-width: 975px) { #popularity { width: 100%; padding: 2.8vw 1vw 0; } } @media screen and (max-width: 480px) { #popularity { padding: 6vw 1vw 0; } #popularity h2 { width: 100%; } #popularity h2 .show-sp { display: block; } } #popularity .price_list { display: flex; justify-content: space-between; flex-wrap: wrap; } #popularity .price_list a { text-decoration: none; width: 33%; height: 60px; margin-top: 10px; background: #ebf6fd; border: 3px solid #01a7eb; border-radius: 10px; box-sizing: border-box; display: flex; align-items: center; justify-content: space-around } #popularity .price_list a:hover { background: #01a7eb; } #popularity .price_list a:hover .place { color: #fff; } #popularity .price_list a:hover .price { color: #ff0; } #popularity .price_list a .place { font-size: 18px; } #popularity .price_list a .price { color: #f30; font-size: 24px; font-weight: bold; } @media screen and (max-width: 480px) { #popularity .price_list { display: block; } #popularity .price_list a { width: 100%; height: 50px; margin: 0; background: url(../img/icon/icon-arrow-right.png) no-repeat 98% 48%; background-size: 20px; border: 1px solid #ccc; border-radius: 0; box-sizing: border-box; display: flex; align-items: center; justify-content: space-around } #popularity .price_list a + a { margin-top: -1px; } } #basic { width: 900px; padding: 3vw 0 0; margin: 0 auto; } @media screen and (max-width: 975px) { #basic { width: 100%; padding: 2.8vw 1vw 0; } } @media screen and (max-width: 480px) { #basic { padding: 6vw 1vw 0; } #basic h2 { width: 98%; } #basic h2 .show-sp { display: block; } } #basic .wrap { -webkit-justify-content: space-between; justify-content: space-between; padding: 1.3vw 0 0; } @media screen and (max-width: 975px) { #basic .wrap { -webkit-justify-content: center; justify-content: center; gap: 1vw 1vw; padding: 2.8vw 1vw 0; } } #basic .box { width: 268px; } @media screen and (max-width: 480px) { #basic .box { width: 100%; } } #basic .box figure { text-align: center; } #basic .box figure img { width: auto; height: auto; } @media screen and (max-width: 480px) { #basic .box figure img { width: 70%; height: auto; } } #basic .box .text { } @media screen and (max-width: 480px) { #basic .box .text { padding: 1vw 0 3vw; } } #basic .box h3 { padding: 0.5vw 0; text-align: center; color: #00a6eb; font-size: 20px; font-weight: bold; } #basic .box .text p { line-height: 1.5; font-size: 13px; } @media screen and (max-width: 480px) { #basic .box h3 { font-size: 2.0rem; font-weight: 600; } #basic .box .text p { line-height: 1.8; } } #choose { width: 900px; padding: 3vw 0 0; margin: 0 auto; } #choose h2 { margin-bottom: 40px; } @media screen and (max-width: 975px) { #choose { width: 100%; padding: 2.8vw 1vw 0; } #choose figure { width: 98%; margin: auto; } #choose figure img { width: 100%; height: auto; } } @media screen and (max-width: 480px) { #choose { padding: 6vw 1vw 0; } #choose h2 { width: 98%; } } #choose h3 { padding: 0.5vw 0; text-align: center; color: #00a6eb; font-size: 20px; font-weight: bold; } #choose figure { text-align: center; } #choose p { line-height: 1.7; width: 800px; margin: 0 auto 50px; } @media screen and (max-width: 975px) { #choose p { width: 98%; } } @media screen and (max-width: 480px) { #choose h3 { font-size: 2.0rem; font-weight: 600; margin-bottom: 5vw; } #choose figure img { width: 100%; height: auto; } #choose p { width: 98%; } } #knowledge { width: 900px; padding: 3vw 0 0; margin: 0 auto; } #knowledge h2 { margin-bottom: 40px; } @media screen and (max-width: 975px) { #knowledge { width: 100%; padding: 2.8vw 1vw 0; } } @media screen and (max-width: 480px) { #knowledge { padding: 6vw 1vw 0; } #knowledge h2 { width: 98%; } } #knowledge h3 { color: #00a6eb; font-size: 20px; font-weight: bold; padding: 14px; margin-bottom: 15px; background: #ebf6fd; border-left: solid 5px #00a6eb; } #knowledge .box { margin-bottom: 20px; display: flex; } #knowledge .box figure { margin: 0; padding: 0; } #knowledge .box p.txt { line-height: 1.7; padding-left: 17px; } @media screen and (max-width: 480px) { #knowledge .box { display: block; } #knowledge .box figure { text-align: center; margin-bottom: 3vw; } #knowledge .box p.txt { padding: 0; margin-bottom: 5vw; } } #recommend { width: 900px; padding: 3vw 0 0; margin: 0 auto; } #recommend h2 { margin-bottom: 40px; } @media screen and (max-width: 975px) { #recommend { width: 100%; padding: 2.8vw 1vw 0; } } @media screen and (max-width: 480px) { #recommend { padding: 6vw 1vw 0; } #recommend h2 { width: 98%; } } #recommend .wrap { width: 900px; margin: auto; display: flex; justify-content: space-between; flex-wrap: wrap; } #recommend .wrap li { width: 434px; padding: 20px 10px; margin-bottom: 20px; border: solid 4px #ebf6fd; box-sizing: border-box; } #recommend .wrap li .company { margin-bottom: 10px; display: flex; align-items: center; } #recommend .wrap li .company h3 { color: #00a6eb; font-size: 20px; font-weight: bold; padding-left: 18px; } #recommend .wrap li .company h3 a { color: #00a6eb; } #recommend .wrap li .txt { font-size: 12px; line-height: 1.7; } @media screen and (max-width: 975px) { #recommend .wrap { width: auto; margin: auto; display: block; } #recommend .wrap li { width: auto; margin: 0 auto 20px; } } @media screen and (max-width: 480px) { #recommend .wrap { width: 98%; } #recommend .wrap li { width: 98%; margin: 0 auto 20px; } } #column { width: 900px; padding: 3vw 0 0; margin: 0 auto; } #column h2 { margin-bottom: 40px; } #column .wrap { width: 900px; margin: auto; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 18px; } #column .wrap li { width: calc((100% - 18px * 3) / 4); border: 1px solid #000000; box-sizing: border-box; border-radius: 3px; } #column .wrap li a { text-decoration: none; } #column .wrap li a:hover { opacity: 0.7; } #column .wrap li figure { margin: 0; width: 100%; } #column .wrap li figure img { width: 100%; height: 100%; aspect-ratio: 212 / 118; object-fit: cover; border-radius: 3px; } #column .wrap li .text { padding: 12px 10px; } #column .wrap li .category { font-size: 14px; padding: 0 8px; letter-spacing: 0; max-inline-size: max-content; } #column .wrap li .category.rentacar { background-color: #666666; color: #ffffff; } #column .wrap li .category.skymark { background-color: #1f3196; color: #ffffff; } #column .wrap li .text time { font-size: 12px; color: #717171; display: flex; align-items: center; margin-top: 8px; gap: 8px; } #column .wrap li .text time span { width: 13px; height: 13px; display: block; } #column .wrap li .text h3 { font-size: 14px; color: #000000; line-height: 1.4; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden; margin-top: 8px; } @media screen and (max-width: 975px) { #column { width: 100%; padding: 2.8vw 1vw 0; } #column .wrap { width: auto; margin: auto; } #column .wrap li { width: calc((100% - 18px) / 2); } } @media screen and (max-width: 480px) { #column { padding: 6vw 1vw 0; } #column h2 { width: 98%; } #column .wrap { width: 98%; gap: 12px; } #column .wrap li .text { padding: 12px 5px; } #column .wrap li .category { font-size: 12px; padding: 4px 5px; } #column .wrap li .text time { font-size: 10px; } #column .wrap li .text h3 { font-size: 12px; } } .column_type_01 .accordion_list .title .title__span { display: block; font-weight: bold; background: url(../img/icon/IconPlus.svg) no-repeat; background-position: right 1vw center; background-size: 1.5rem; } @media screen and (max-width: 975px) { .column_type_01 .accordion_list .title .title__span { padding: 1.5vw 1vw 1.5vw 1.5vw; } } @media screen and (max-width: 480px) { .column_type_01 .accordion_list .title .title__span { padding: 0; } } .q_and_a_list .title.active .title__span, .contact_tab_cont .accordion_list .title.active .title__span, .column_type_01 .accordion_list .title.active .title__span { background-image: url(../img/icon/IconMinus.svg) } .q_and_a_list .cont, .contact_tab_cont .accordion_list .cont, .column_type_01 .accordion_list .cont { display: none; padding: 0.5vw 1vw 2vw 1vw; } @media screen and (max-width: 480px) { .q_and_a_list .cont, .contact_tab_cont .accordion_list .cont, .column_type_01 .accordion_list .cont { padding: 0.5vw 1vw 6vw 1vw; } } .q_and_a_list .cont.active, .contact_tab_cont .accordion_list .cont.active, .column_type_01 .accordion_list .cont.active { display: block } .column_type_01 { /*display: flex*/ } .qa { width: 976px; padding: 3vw 0 0; margin: 0 auto; } @media screen and (max-width: 975px) { .qa { width: 100%; padding: 2.8vw 1vw 0; } } @media screen and (max-width: 480px) { .qa { padding: 6vw 1vw 0; } .qa h2::after { content: none; } .qa h2 .show-sp { display: block; } .qa h2 span { font-size: 1.7rem; } } .qa .contents { margin: 1.2vw 0 0; } .qa .contents dl dt.title { position: relative; padding: 1vw 1vw 1vw 1.5vw; margin: 0 0 1.5vw; line-height: 1.6; color: #4B4B4B; font-size: 1rem; background-color: #F6F6F6; transition: all 0.5s 0s ease; cursor: pointer; } @media screen and (min-width: 976px) { .qa .contents dl dt.title { padding: 16px 18px 16px 22px; margin: 0 0 10px; } } @media screen and (max-width: 480px) { .qa .contents dl dt.title { padding: 3vw 1vw 3vw 1.5vw; font-size: 1.6rem; } } .qa .contents dl dt.title::before { content: "Q"; display: inline-block; position: absolute; top: 50%; left: 1.5vw; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); color: #4B4B4B; font-size: 1rem; font-weight: bold; } @media screen and (min-width: 976px) { .qa .contents dl dt.title::before { left: 16px; } } @media screen and (max-width: 480px) { .qa .contents dl dt.title::before { top: 5vw; font-size: 1.5rem; } } .qa .contents dl dt.title:hover { opacity: 0.7; } .qa .contents span.title__q { margin-right: 0.8vw; font-size: 1.5rem; } .qa .contents span.title__text { margin-left: 2vw; } @media screen and (min-width: 976px) { .qa .contents span.title__text { margin-left: 24px; } } @media screen and (max-width: 975px) { .qa .contents span.title__text { display: block; width: 88%; margin-left: 3.6vw; } } @media screen and (max-width: 480px) { .qa .contents span.title__text { width: 82%; margin-left: 6.6vw; line-height: 1.3; } } .qa .contents p.text_left { position: relative; } .qa .contents p.text_left::before { content: ""; display: inline-block; position: absolute; top: 50%; left: 0; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); width: 12px; height: 12px; background-image: url(../img/icon/ArrowIcon-org.png); background-size: contain; background-repeat: no-repeat; } .qa .contents p.text_left span { padding-left: 1vw; font-size: 1rem; } @media screen and (min-width: 976px) { .qa .contents p.text_left span { padding-left: 20px; } } @media screen and (max-width: 975px) { .qa .contents p.text_left span { padding-left: 2vw; } } @media screen and (max-width: 480px) { .qa .contents p.text_left span { display: block; padding-left: 5vw; margin: 1.5vw 0 0; } } .qa .contents dl.accordion_list .cont .ans { display: -webkit-flex; display: flex; } .qa .contents dl.accordion_list .cont .ans p.faq__ans { color: #fff; font-size: 1.5rem; font-weight: bold; } .qa .contents dl.accordion_list .cont .ans p.faq__ans span { display: -webkit-flex; display: flex; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; width: 32px; height: 32px; background-color: #00a8e8; } .qa .contents dl.accordion_list .cont .ans p.faq__a__text { line-height: 1.5; margin-left: 1vw; } @media screen and (min-width: 976px) { .qa .contents dl.accordion_list .cont .ans p.faq__a__text { margin-left: 10px; } } @media screen and (max-width: 480px) { .qa .contents dl.accordion_list .cont .ans p.faq__a__text { margin-left: 4vw; } } @media screen and (max-width: 480px) { #support.show-sp { display: block; } #support { padding: 6vw 1vw 0; } #support h2 { width: 98%; padding: 0 0 2vw; margin: 0 auto; text-align: center; line-height: 1.3; border-bottom: 2px solid #4EAC84; } #support h2::before { content: ""; position: absolute; top: unset; right: 0; left: unset; bottom: -3px; width: 70%; height: inherit; border-bottom: 2px solid #0C8953; } #support h2::after { content: none; } #support ul { padding: 3vw 0 0; } #support ul li { position: relative; margin-bottom: 1.5vw; line-height: 1.3; font-size: 1.6rem; font-weight: 600; } #support ul li a { display: block; padding: 3vw 0 3vw 7%; color: #4B4B4B; background-color: #F6F6F6; text-decoration: none; transition: all 0.5s 0s ease; } #support ul li a::after { content: ""; display: inline-block; position: absolute; top: 35%; right: 1.5%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); width: 16.2px; height: 10.8px; background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2218%22%20height%3D%2212%22%20viewBox%3D%220%200%2018%2012%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M2%202L9%209L16%202%22%20stroke%3D%22%234EAC84%22%20stroke-width%3D%224%22%20stroke-linecap%3D%22round%22%2F%3E%3C%2Fsvg%3E'); background-size: contain; background-repeat: no-repeat; transform: rotate(-90deg); } #support ul li a:active { opacity: 0.7; text-decoration: none; } #support ul li i { margin-right: 1.5vw; color: #0C8953; } #support ul li .fa-envelope::before, #support ul li .fa-calendar-check::before { font-size: 1.9rem; position: absolute; top: 50%; left: 1%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); } }