/** Shopify CDN: Minification failed

Line 554:0 Expected "}" to go with "{"

**/

.page-width-customers-account-menu{
  background: #E9F5FC;
  flex-wrap: column;
    width: 100%;
    padding: 16%;
    align-items: flex-start;
    gap: 8px;
    align-self: stretch;
    height: 1200px;
}

.grid-account{
    display: grid;
    gap: 24px;
    margin: 30px;
    grid-template-columns: 49% 49%;
    width: auto;
    /* grid-template-rows: 11% 42% 51%; */
}

.header-area{
    grid-column-start: 1;
    grid-column-end: 3;
    /* margin-top: 12px; */
    position:relative;
    height: 130px;
    background-color: rgb(0, 155, 229);
    box-shadow: 0 5px 20px #0e3d5a1a;
    border-radius: 4px;
    padding: 24px;
}
.header-area .customer-icon{
    position:absolute;
    left: 30px;
    top: -30px;
    width:120px;
    height:120px;
    object-fit: cover;
    border-radius:50%;
}
.header-area .hello-name {
    position:absolute;
    color:white;
    font-size: 30px;
    font-weight: 700;
    top:30px;
    right:25px;
}
.header-area .welcome-message {
    position:absolute;
    color:white;
    font-size: 20px;
    top:70px;
    right:25px;
    text-align:right;
}
/* .grid__item-my-profile-page > .grid__item-my-profile-detail {
  position:relative;
}
*/
.grid__item-my-profile-page {
    gap: 20px;
}

.grid__item-my-profile-page .customer-icon{
    width:80px;
    height:80px;
    object-fit: cover;
    border-radius:50%;
}
.grid-account-other-page{
    display: flex;
    flex-flow: column;
    gap: 24px;
    margin: 30px;
    grid-template-columns: 50% 50%;
    width: 560px;
}


.page-width-customers-account{
  background: #F7F8F8;
  padding-bottom: 100px;
  grid-template-columns: auto 80%;
  display: grid;
}

.grid__item-title-menu{
  display: flex;
  padding-bottom: 24px;
  gap: 8px;
}

.section-header__link{
     font-family: Noto Sans;
    color: #4c4948;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    letter-spacing: .5px;
    margin: 0;
    padding-left: 8px;
}

.page-content{
 padding-bottom: 75px;
 padding-top: 75px;
}

.grid > div{
  box-sizing: border-box;
  padding: 24px;
}
.grid__item-my-profile{
  background: white;
  box-shadow: 0px 5px 20px 0px rgba(14, 61, 90, 0.10);
  border-radius: 4px;
  padding: 24px;
      display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.grid__item-my-profile-buttons{
  display: flex;
  justify-content:flex-end;
  gap: 8px;
  /* border: 1px solid #2299E1;
  border-radius: 32px;*/
}

.grid__item-my-profile-buttons a{
    color: #2299E1;
  font-size: 16px;
  font-weight: 600;
  line-height: 22px; /* 137.5% */
  letter-spacing: 0.5px;
}
.edit-account-icon{
  display: inline-block;
  margin: 0 0 0 auto;
  height: 30px;
}

.grid__item-my-favorites{
  background: white;
  box-shadow: 0px 5px 20px 0px rgba(14, 61, 90, 0.10);
  border-radius: 4px;
  padding: 24px;
  height: 460px;
}
/* .grid__item-my-favorites .grid__item-title{
  position:relative;  
}*/
.grid__item-my-favorites .view-all-button{ 
  border:1px solid #2299E1;
  color: #2299E1;
  font-size:12px;
  border-radius: 20px;
  width: 100px;
  display: inline-block;
  text-align: center;
  /* position:absolute;
  right:-10px; */
  margin: 0 0 0 auto;
  padding: 5px 15px;
}
.grid__item-zoff-membership{
  background: white;
  box-shadow: 0px 5px 20px 0px rgba(14, 61, 90, 0.10);
  border-radius: 4px;
  padding: 24px;
  height: 100%;
}
.grid__item-my-vouchers{
  background: white;
  box-shadow: 0px 5px 20px 0px rgba(14, 61, 90, 0.10);
  border-radius: 4px;
  padding: 24px;
}
.grid__item-my-orders{
  background: white;
  box-shadow: 0px 5px 20px 0px rgba(14, 61, 90, 0.10);
  border-radius: 4px;
  padding: 24px;
}
.grid__item-personal-information{
  background: white;
  box-shadow: 0px 5px 20px 0px rgba(14, 61, 90, 0.10);
  border-radius: 4px;
  padding: 24px;
}

.grid__item-title{
  display: flex;
  padding-bottom: 24px;
  gap: 8px;
}

.grid__item-title-menu-other-page{
    display: flex;
  gap: 8px;
  margin-top: 40px;
}

h2{
  font-family: Noto Sans;
  color: #2299E1;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 26px; /* 130% */
  letter-spacing: 0.5px;
  margin: 0px;
  text-transform: none;
}

h3{
  font-family: Noto Sans;
  color: #4C4948;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: 0.5px;
  margin: 0px;
  text-transform: none;
}

h1{
  font-family: Noto Sans;
  color: #2299E1;
  font-size: 32px;
  font-style: normal;
  font-weight: 600;
  line-height: 40px; /* 125% */
  letter-spacing: 0.5px;
  margin:0px;
  text-transform: none;
}
.h3-dashboard h3{
  color: #2299E1;
}
.h3-myorder h3{
  color: #2299E1;
}
.h3-myorder h3{
    color: #2299E1;
}

/* カードのサイズ　*/
.img_card{
  width: 365px;
  height: 100%;
}

.order-title{
  color: #2299E1;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 26px; /* 130% */
  letter-spacing: 0.5px;
}
.grid__item-product-care-service{
    display: flex;
    align-items: flex-start;
}

.grid__item-product-care-service img{
  width: 30%;
  padding: 10px;
}
/*popup表示させたいコンテンツのレイアウトと位置*/

.popup-content{
	display: inline-block;
	position: fixed;
	width: 30%;
	z-index: 1100;
	background: #fff;
	/* padding-bottom: 292px; */
    border-radius: 16px;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	overflow-y: scroll;
    margin: auto;
    text-align: center;
}
.img-popup{
  width:100%;
}
#qr{
   color: black;
  width: 180px;
  height: auto;
}

#popup {
  display: none;
}

icon-warning{
  width:100%;
}

label{
display:block;
}

/*ボタンの装飾*/
/*label span{
  display:block;
  background-color:#01b6ed;
  color:#fff;
  width:200px;
  line-height:40px;
  border-radius:4px;
  text-align:center;
}
label span:hover{
  cursor:pointer;
}*/

input[type="checkbox"]{
  display:none;
}

/*checkboxがチェックの状態になったらpopupを表示させる*/
input[type="checkbox"]:checked + #popup{
  display:block;
}

.popup-bg-cover{
	position: fixed; /* ブラウザの定位置に固定 */
	background: rgba(0, 0, 0, .5); /* 背景色を半透明の黒色に */
	width: 100%; /* 要素の横幅を画面全体に */
	height: 100%; /* 要素の高さを画面全体に */
	top: 0; /* 要素の固定位置をブラウザ最上部に合わせる */
	left: 0; /* 要素の固定位置をブラウザ左側に合わせる */
	z-index: 1000; /* 要素をコンテンツより前面に（要調整） */
}

.grid__item-title-collums{
  gap:24px;
  display: flex;
  flex-flow: column;
}

grid__item-title-collum{
   display: flex;
   flex-flow: column;
   margin-bottom: 24px;
}

p{
  font-family: Noto Sans;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px; 
  margin: 0px;
  padding-bottom: 4px;
}

h3{
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 22px;
}

.popup-content-delite-account{
    display: flex;
    position: fixed;
    flex-flow: column;
	position: fixed;
	width: 40%;
	z-index: 1100;
	background: #fff;
    border-radius: 8px;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	overflow-y: scroll;
	justify-content: center;
    text-align: center;
    padding: 40px;
    text-transform: none;
}

.popup-content-delite-account img{
    width: 64px;
    margin-right: auto;
    margin-left: auto;
  　　margin-bottom: 24px;
}

.popup-content-delite-account-icon{
    width: 20px;
    margin: 0 0 0 auto;
}

.popup-content-delite-account h3{
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 26px; 
  letter-spacing: 0.5px;
  padding-bottom: 16px;
}

.popup-content-delite-account p{
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px; 
  padding-bottom: 32px;
}

.popup-content-delite-account button{
  width: 254px;
  height: 48px;
  padding: 16px 24px;
  gap: 8px;
  background: #2299E1;
  border-radius: 32px;
}

.popup-content-delite-account span{
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 22px; /* 137.5% */
  letter-spacing: 0.5px;
  color: #ffffff;
}

/* タブレットのレスポンシブ */
@media screen and (max-width: 1126px) {
  .img_card {
    width:100%;
    height: auto;
  }
}

/* スマホのレスポンシブ */
@media only screen and (max-width:768px){
    h1{
    font-size: 24px;
  }
  .grid-account{
    grid-template-rows: none;
}
  .page-width-customers-account{
    display: flex;
    flex-flow: column;
  }
  .page-width-customers-account-menu{
    display: flex;
    flex-flow: column;
    padding: 8%;
    height: auto;
  }
  .grid-account-other-page{
    width:80%;
  }
  .account-menu{
    height:auto;
  }
  .grid-account{
    grid-template-columns: none;
  }
  .header-area{
    grid-column-start:1;
    grid-column-end:2;
    /* height: 110px; */
  }
  .header-area .customer-icon{
    position:absolute;
    left: 20px;
    top: -20px;
    width:80px;
    height:80px;
  }
  .header-area .hello-name {
      font-size: 24px;
      font-weight: 700;
      top:40px;
      right:15px;
  }
  .header-area .welcome-message {
      font-size: 16px;
      top:70px;
      right:15px;
     text-align: right;
  }
  .header-area{
    width:100%;
  }
    .grid__item-zoff-membership{
      width:100%;
  }

  .grid__item-my-profile{
      width:100%;
  }
    .grid__item-my-orders{
      width:100%;
  }
    .img_card {
    width: 365px;
    height: 100%;
  }

  .popup-content{
	display: inline-block;
	position: fixed;
	width: 40%;
	z-index: 1100;
	background: #fff;
	/* padding-bottom: 292px; */
    border-radius: 16px;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	overflow-y: scroll;
    margin: auto;
    text-align: center;
    width: 80%;
}
    .grid__item-title-menu-other-page{
  margin-top: 20px;
}

  .grid-account-other-page{
    gap: 16px;
}
@media only screen and (max-width: 473px){
  .img_card {
    width:100%;
    height: auto;
  }
  
}