@charset "UTF-8";
*,*::before,*::after {box-sizing: border-box;}
/**{border: 1px solid #eb6100;}*/
html{font-size: 62.5%; height: 100%;}
body{font-size: 1.65rem; margin: 0; padding: 0; width: 100%; height: 100%; font-family: "Roboto","Fira Sans","Open Sans","Oswald","IBM Plex Sans JP","Sawarabi Gothic", sans-serif; font-weight: 400; color:#333333;}
.clear{clear:both;}
a {text-decoration: none; color: #004987;}
a:hover {text-decoration: none; color:#004987;}
.p-xxl-b{width: fit-content; margin: 50px auto 0; text-align: center; font-size: 3.0em; font-weight: bold;}
.p-xl-n{width: fit-content; margin: 50px auto 0; text-align: center; font-size: 1.6em; font-weight: normal;}
.img_w100{width:100%; height:auto;}
.sp_br{display: none;}

.pankuzu{width: 100%; position: relative; top:-10px; padding: 0; margin: 0; color:#0A0A0A;}
.pankuzu ul{display:flex;}
.pankuzu ul li{list-style:none; padding-right:0.5em; position: relative;}
.pankuzu ul li a{color: #454545;}
.index_plink{width:100%; padding: 0.5em 1.0em; text-align: right;}
.index_plink a{color: #454545;}

/* HEADER */
/*-------------------------------------------------------------------------*/
header{width: 100%; position: fixed; top: 0; left: 0; border-bottom: 2px solid rgba(255, 255, 255, 0.3); transform: rotate(0.03deg); background: #004987; z-index: 101;}
header i{margin-right: 0.5em}
.head-main{width: 100%; height:70px; margin:0 auto; padding: 0; position: relative; font-size: 0.95em; display: flex;}
.head-logo{width: 310px; height:auto; margin: 0; padding: 8px 5px 0 15px;}
.head-menu{display: flex; width: calc(100% - 330px); float:right; justify-content: flex-end; z-index: 100;}
.head-logo h1{width:fit-content; margin: 0; padding: 0; font-size: 0; line-height: 1}
.head-logo img{width: 280px; height: auto;}
.head-logo img:hover{transform: scale(1.1); opacity: 0.5; transition-duration: 0.3s;}
.main-menu{background:#004987; color:#ffffff; display:flex; flex-wrap:wrap; justify-items: end; align-items:center; list-style:none; margin:0; padding:0 1em 0 0; z-index:99;}

.sub-on{position:relative; display:block; padding:0 2em 0 1em; cursor:pointer;}
.sub-on a{color: #ffffff;}
.sub-on span::before{content:'\e903'; position:absolute; right: -1.0em; top: 0.25em; font-family:'inxray-font',sans-serif; font-weight:600;}
.sub-no{display:block; position: relative; padding:0 2em 0 1em; cursor:pointer;}
.sub-no span::before{content:'\e907'; position:absolute; right: -1.0em; top: 0.25em; font-family:'inxray-font',sans-serif; font-weight:600;}

.sub-menu{position:absolute; width: 100%; top:72px; left:0; transform:translateY(-20px); opacity:0; visibility:hidden; background: #004987; box-shadow:0 2px 5px rgba(0,0,0,0.2); transition:all .3s ease; text-align:left; z-index:90;}
.sub-menu.open{transform:translateY(0); opacity:1; visibility:visible;}
.sub-sub{align-items:center; padding: 1.0em 1.0em; justify-content: flex-end;}
.sub-div{width: 240px; margin-left: auto; padding-left: 20px; justify-content: flex-start;}

.sub-main span::before, .sub-div .sub-sub span::before{content:'\e907'; position:absolute; right: -1.0em; top: 0.25em; font-family:'inxray-font',sans-serif; font-weight:600;}
.main-menu a span{position:relative; display:inline-block; padding:0 .5em; color:#ffffff;}
.main-menu a:hover span{color: #ffe354;}
.main-menu a span::after{content:''; position:absolute; bottom:-6px; left: 0.25em; width:calc(100% + 0.75em); height:2px; background:#ffe354; transform:scale(0,1); transform-origin:left top; transition:transform .3s ease;}
.main-menu a:hover span::after{transform:scale(1,1);}

.head_bt{position:relative; width:50px; display:none; text-align:center; color:#fff; vertical-align:middle; font-size:2.5em; z-index:10000;}
.head_bt span{position:absolute; top:2px; right: 0; cursor:pointer;}
.openbtn{position:relative; cursor:pointer; width:100%; height:50px;}
.openbtn span{display:inline-block; transition:all .4s; position:absolute; left:13px; height:3px; border-radius:5px; background: #ffffff; width:70%;}
.openbtn span:nth-of-type(1){top:10px; transform:none;}
.openbtn span:nth-of-type(2){top:23px; width:50%; opacity:1;}
.openbtn span:nth-of-type(3){top:36px; width:30%; transform:none;}
.openbtn.active span:nth-of-type(1){top:15px; left:10px; transform:translateY(6px) rotate(-45deg); width:70%}
.openbtn.active span:nth-of-type(2){opacity:0;}
.openbtn.active span:nth-of-type(3){top:27px; left:10px; transform:translateY(-6px) rotate(45deg); width:70%}

@media screen and (max-width:599px) {
    body{font-size: 1.5rem;}
    .p_in1{text-indent: 1.0em; padding-left:0.5em; line-height: 1.5; font-size: 1.1em;}
    .p_in2r{text-indent: 2em; padding-right:0.5em; line-height: 1.5; text-align: right;}
    .sp_br{display: block;}
    .head-main{width: 100%; height:62px; margin:0 auto; padding: 0; position: relative; font-size: 0.95em; display: flex;}
    .head-logo{width: 200px; margin: 0; padding: 10px 0 0 5px;}
    .head-logo img{width: 100%; height: auto;}
    .head-menu{display: flex; width: calc(100% - 210px); float:right; justify-content: flex-end; z-index: 100;}

    .head_bt{display:block; position:fixed; top:5px; right:10px; width:50px; height:50px; z-index:100;}
    .headline {position: relative; padding: 0 30px; margin: 0 0 0.5em 0; text-align: center; font-size: 1.6em;}
    .headline:before {position: absolute; top: calc(50% - 1px); left: 10%; width: 80%; height: 2px; content: ''; background: #004987;}
    .headline span {position: relative; padding: 0 1em; background: #fff;}



    .main-menu{position:fixed; display: block; top:62px; right:-100%; width:100%; height:calc(100vh - 62px); background: rgba(0, 90, 180, 0.9); flex-direction:column; align-items:stretch; justify-content:flex-start; transition:right .4s ease-in-out; z-index:9999; padding:0;}
    .main-menu.active{right:0;}
    .sub-on,.sub-no{width:100%; padding:1em 0.5em; border-bottom:1px solid rgba(255,255,255,0.2);}
    .sub-on span,.sub-no span{display:block; position:relative; width:100%; }
    .sub-on a span,.sub-no a span{color:#fff;}
    .sub-on a:hover span,.sub-no a:hover span{color:#fff;}
    .sub-on span::before{content:'\e903'; position:absolute; right: 1.0em; top: 0.1em; font-family:'inxray-font',sans-serif; font-weight:600;}
    .sub-on.open span::before {transform: rotate(180deg);}
    .sub-no span::before{content:'\e907'; position:absolute; right: 1.0em; top: 0.1em; font-family:'inxray-font',sans-serif; font-weight:600;}
    .sub-div{width: 100%; margin-left: auto; padding: 0; justify-content: flex-start;}
    .sub-main span::before, .sub-div .sub-sub span::before{content:'\e907'; position:absolute; right: 1.0em; top: 0.25em; font-family:'inxray-font',sans-serif; font-weight:600;}
    .sub-menu{position:static; max-height:0; overflow:hidden; flex-direction:column; background: rgb(0, 73, 135); box-shadow:none; width:100%; text-align:left; padding:0; margin:0; opacity:0; visibility:visible; transform:none; transition:max-height .4s ease,opacity .4s ease;}
    .sub-menu.open{max-height:500px; opacity:1;}

    .sub-main{margin: 0; padding:1.0em 0.5em 1.0em 1.0em; text-align:left; border-bottom:1px solid #4489d1; background: #004987;}
    .sub-sub{margin: 0;padding:1.0em 0.5em 1.0em 3.5em; text-align:left; border-bottom:1px solid #4489d1; background: #004987;}
    .sub-main span,.sub-sub span{display:block; position:relative; width:100%; color:#fff;}
    .sub-main span::before, .sub-sub span::before{content:'\e907'; position:absolute; right: 1.0em; top: 0.1em; font-family:'inxray-font',sans-serif; font-weight:600;}
    .sub-main a span,.sub-sub a span{display:block; width:100%; color:#fff;}
    .main-menu a:hover span::after{transform:scale(0,1);}
    }
/* Footer */
/*-------------------------------------------------------------------------*/
footer{position:fixed; bottom:0;width:100%; height:70px; background: rgb(0, 73, 135); color:#ffffff; overflow: hidden; margin: 0; z-index: 100;}
.footer-menu{width:100%; margin:0 auto; padding:0;}
.footer-menu p{margin: 0.5em 0; padding:0; text-align: center;}
.footer-menu a{color: #ffffff;}
/* MAIN */
/*-------------------------------------------------------------------------*/
main{width: 100%; height:calc(100% - 70px); margin: 70px auto 60px; padding: 10px 0.5em 100px; position:relative; z-index:1;}
.page_title{width: 100%; max-width:600px; text-align: left; margin: 1.0em auto;}
/*-------------------------------------------------------------------------*/
.ul-grid{display: flex; flex-wrap: wrap; width: 100%; margin:0; padding: 0;}
.ul-grid li{padding: 0; margin: 0; border-collapse: collapse; display: inline-block; list-style: none; vertical-align: middle; line-height: 1;}
.li-relative{position:relative;}
.ul-grid li.mar-1{margin: 0 1%;}
.ul-grid li.mar-2{margin: 0 2%;}
.ul-grid li.li23{width:23%;}
.ul-grid li.li25{width:25%;}
.ul-grid li.li29{width:29%;}
.ul-grid li.li30{width:30%;}
.ul-grid li.li40{width:40%;}
.ul-grid li.li50{width:50%;}
.ul-grid li.li60{width:60%;}
.ul-grid li.li70{width:70%;}
.ul-grid li.li100{width:100%;}
.ul-grid li.al_ce{text-align: center;}
.ul-grid li.pd66{padding: 6px;}
.ul-grid li.pd12-6{padding: 12px 6px;}
.ul-grid li a{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.ul-grid li a:hover{background: rgba(255,255,255,0.5);}
.ul-profile{display: block; padding: 0; margin: 0 0 0 0.5em; font-size:110%;}
.ul-profile li {display: list-item; list-style: disc; margin-left: 1.5em;vertical-align: baseline; line-height: 1.8;}
.ul-profile li:first-child{list-style:none; font-size:105%; margin: 0.5em 0 0 1.5em; font-weight: 500;}
.ul-profile li:first-child span{font-size:80%; font-weight: normal}

.ul-normal {display: block; padding: 0; margin: 0 0 0 0.75em;}
.ul-normal li {display: list-item; list-style: circle; margin: 0.5em 0 0 1.75em; vertical-align: baseline; line-height: 1.8; }

.top_base{width:100%; margin:0 auto; background: rgb(0, 73, 135);}
.top_contents{display: flex; width:1260px; margin:0 auto; padding:0; flex-direction: column;}

.top_messeage-y{position: absolute; top: 40%; left: 6%; transform:translate(-6%, -40%); width:30%; margin:0 auto; padding:0; z-index:90;}
.name_big_ye{position:relative; transform: rotate(-8deg); font-size: 1100%; font-weight: 900; color:#F4EA2A;}
.top_messeage-w{position: absolute; top: 33.5%; left: 48%; transform:translate(-48%, -33.5%); width:30%; margin:0 auto; padding:0; z-index:90;}
.name_big_we{position:relative; transform: rotate(-8deg); font-size: 500%; font-weight: 900; color:#ffffff; line-height: 1.15;}


.xgun_frame{position:absolute; width:fit-content; bottom: 15%; left: 10%; transform: rotate(-6deg) translate(-10%, 15%); z-index:88;}
.xgun_frame img{opacity:0.6;}
.copy_frame{position:absolute; width:fit-content; bottom: 15%; left: 10%; transform: rotate(-6deg) translate(-10%, 15%); font-size: 300%; font-weight: 600; color:#fff; z-index:90;}
.copy1{}
.copy1 span{display:inline-block; font-size: 90%; font-weight: 500;}
.copy2{}
.copy2 span{display:inline-block; font-size: 90%; font-weight: 500;}
.img_frame{position:absolute; top: 0; right: 0; z-index:89;}
.contents{width:1260px; min-height:calc(100vh - 200px); margin:0 auto; padding:0;}
.contents_inf{width:1260px; min-height:calc(100vh - 200px); margin: 60px auto 0; padding:0;}

.htitle{position:relative; padding:0 65px; text-align:center; font-size: 1.8em;}
.htitle:before{position:absolute; top:calc(50% - 1px); left:50%; transform:translateX(-50%); width:600px; height:3px; content:''; background: rgb(0, 73, 135);}
.htitle p{position:relative; width: fit-content; left:50%; transform:translateX(-50%); margin: 0; padding:0 1em; background:#fff;}
.htitle P span{position:relative; display: block; width: fit-content; top:-0.25em; left:50%; transform:translateX(-50%); margin: 0; padding:0; font-size: 0.7em; font-weight: normal;}

.login{width:100%; max-width: 600px; margin:0 auto!important; padding:0;}

.ul-form{display: flex; flex-wrap: wrap; width: 100%; max-width: 600px; list-style: none; margin: 0 auto; padding: 0 1em;}
.ul-form li{margin: 0; border-collapse: collapse; column-gap: 1px; padding: 0.25em; display: inline-block; vertical-align: middle; line-height: 1.6;}
.ul-form li:nth-child(odd){width: 35%; text-align: left; padding-left:0.5em;}
.ul-form li:nth-child(even){width: 65%; text-align: left; padding-left:0.5em;}
.ul-form li.li_all{width: 100%; text-align: center;}
.ul-form li.li_all_l{width: 100%; text-align: left;}
.ul-form li.licheck{position: relative;}
.ul-form li.licheck::before {content: ""; position: absolute; left: 0; top: 45%; height: 40%; width: 3px; background-color: #a30000; transform: translateY(-50%);}
.ul-form button.submit{border:1px solid #e7773a; border-radius: 3px; padding: 0.5em 1.5em; text-decoration:none; display:inline-block; font-size: 1.0em; color: #e7773a;background-color: #ffffff; cursor: pointer;}
.ul-form button.submit i{font-size: 1.2em; margin-right: 0.5em;}
.ul-form button.submit:hover{border:1px solid #e7773a;color: #ffffff;background-color: #e7773a;}
input[type=text],[type=tel],[type=email] ,[type=date],[type=number],[type=password] ,[textarea]{
    font: 15px/24px sans-serif;  margin: 0.5px 1px; padding: 0.2em; transition: 0.3s; border: 1px solid #666666; border-radius: 4px; outline: none;
}
input[type=text]:focus,[type=tel]:focus,[type=email]:focus,[type=date],[type=number]:focus,[type=password]:focus{
    border-color: #0B318F;
}
input[type=text]::placeholder,[type=tel]::placeholder,[type=email]::placeholder ,[type=date] ::placeholder,[textarea]::placeholder,[type=password]::placeholder{
    color: #cdcdcd;
}
.input100{width:100%;}
.input50{width: 50%}
.li-relative{position: relative;}
.toggle-password {position: absolute; right: 0.5em; top: 55%; transform: translateY(-50%); background: none; border: none; font-size: 1.2em; cursor: pointer; padding: 0; z-index: 10;}
.form_messe{display: block; font-size: 0.85em}

/*------------------------------------------------------------------------*/
/*WooCommerce*/
/*-------------------------------------------------------------------------*/
.empty-cart-message{width: 100%; max-width: 600px; margin: 0 auto;}
.woocommerce-account .woocommerce-MyAccount-navigation {display: none !important;}
/* コンテンツを全幅に */
.woocommerce-account .woocommerce-MyAccount-content {width: 100% !important; max-width: 100% !important; margin-left: 0 !important; padding-left: 0 !important;}
/* flex / grid の影響を解除 */
.woocommerce-account {display: block !important;}
.woocommerce-notices-wrapper{width:100%; max-width: 600px; margin: 0 auto;}
.woocommerce-EditAccountForm{width:100%; max-width: 600px; margin: 0 auto;}
.edit-account{}
#billing_country {background-color: #f5f5f5; pointer-events: none; opacity: 1;}
.woocommerce-billing-fields input[readonly] {background-color: #f5f5f5; cursor: not-allowed;}
#billing_country {background-color: #f5f5f5; pointer-events: none; opacity: 1;}
.woocommerce-billing-fields .edit,
.woocommerce-billing-fields__field-wrapper .edit,
.woocommerce-billing-fields .woocommerce-edit-address,
.woocommerce-billing-fields .wc-block-components-address-card__edit {display: none !important;}

.select-wrap{position:relative; width:100%;}
.select-wrap::after{content:'\e903'; position:absolute; right:12px; top:50%;transform: translateY(-50%); font-size:1.4em; color:#036eb8; pointer-events:none;}
select.orderby{width:100%; cursor:pointer; appearance:none; border-radius:2px; border:1px solid #9fa0a0; background:#fff; padding:8px 38px 8px 8px; color:#036eb8;}
select.orderby::-ms-expand{display:none;}

