:root{
  --BackgroundImage:        url(https://www.awexion.jp/cgi-bin/a.cgi/.P18800000000000041880000000000010/Cover/BackgroundImage);
  --BackgroundColor:        #7F7F7F;
  --HeaderBackground:       linear-gradient(to right, rgba(255,255,255,0.0),rgba(255,255,255,0.7),rgba(255,255,255,0.0));
  --FooterBackground:       linear-gradient(to right, rgba(255,255,255,0.0),rgba(255,255,255,0.7),rgba(255,255,255,0.0));
  --TopSideBackground:      url(https://www.awexion.jp/Cambus.png);
  --ParBackground:          url(https://www.awexion.jp/Cambus.png);
  --ButtonBackground:       rgba(255,63,0,0.8);
  --MenuButtonBackground:   rgba(255,255,255,0.8);
  --HeadLineBackground:     linear-gradient(to right, rgba(255,255,255,0.0),rgba(255,255,255,0.9),rgba(255,255,255,0.9),rgba(255,255,255,0.0));
}

body      {
    -webkit-text-size-adjust:       100%;
    width:                  99vw;
    margin:                 0;
    padding:                0;
    font-family:            sans-serif;
    font-size:              1.2rem;
    color:                  black;
    line-height:            1.5;
}

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

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

.a-right  {
    text-align:             right;
}

.a-justify{
    text-align:             justify;
}

div.wrapper{
    display:                block;
    position:               fixed;
    top:                    0;
    left:                   0;
    z-index:               -1;
    width:                  99vw;
    height:                 100vh;
    padding-top:            100px;
    background-color:       var(--BackgroundColor);
    background-image:       var(--BackgroundImage);
    background-size:        cover;
    background-position:    top center;
    background-repeat:      no-repeat;
}

div.large{
    font-size:              2.0rem;
    font-weight:            bold;
}

div.small{
    font-size:              0.8rem;
}

div.login {
    margin-left:            20%;
    text-align:             left;    
}

div.search{
    margin-left:            20%;
    text-align:             left;    
}

div.article{
    display:                flex;
    width:                  99vw;
}

div.SideHeader{
    font-size:              1.2rem;
    margin-top:             50px;
    margin-bottom:          50px;
    margin-left:            1vw;
    margin-right:           84vw;
    width:                  14vw;
    padding:                0%;
    border-radius:          0.2em;
    background:             var(--TopSideBackground);
    position:               fixed;
}

div.main{
    display:                block;
    margin-left:            15.0vw;
    margin-right:           15.0vw;
    padding-top:            50px;
    padding-bottom:         50px;
    padding-left:           0.0%;
    padding-right:          0.0%;
    background:             none;
    width:                  69vw;
}

div.SideFooter{
    font-size:              1.2rem;
    margin-top:             50px;
    margin-bottom:          50px;
    margin-left:            84vw;
    margin-right:           1vw;
    width:                  14vw;
    padding:                0;
    border-radius:          0.2em;
    background:             var(--TopSideBackground);
    position:               fixed;
}

div.par {
    font-size:              1.2rem;    
    margin-bottom:          1em;
    margin-left:            5.0%;
    margin-right:           5.0%;    
    padding-top:            2.0%;
    padding-bottom:         2.0%;
    padding-left:           5.0%;
    padding-right:          5.0%;
    border-radius:          0.5em;
    background:             var(--ParBackground);
}

div.ProductHead{
    margin-top:             0;
    margin-bottom:          0;
    margin-left:            5.0%;
    margin-right:           5.0%;    
    border-radius:          0.5em;    
    background:             rgba(255,255,255,0.9);
}

div.ProductTopMenu{
    margin:                 0;
    text-align:             center;
    background:             linear-gradient(to right, rgba(255,255,255,0.0),rgba(255,255,255,0.8),rgba(255,255,255,0.0));
}

div.parMenu{
    margin:                 0;
    text-align:             center;
    background:             linear-gradient(to right, rgba(255,255,255,0.0),rgba(255,255,255,0.8),rgba(255,255,255,0.0));
}

form      {
    display:                inline;
}

figure    {
    float: left;
    margin: 0 1em 1em 0;
    background: none;    
}

figure img{
    max-witdh: 40.0%;
}

img  {
    vertical-align:         middle;
    pointer-events:         none;
    -webkit-touch-callout:  none;
    -webkit-user-select:    none;
    -webkit-user-drag:      none;
    -moz-touch-callout:     none;
    -moz-user-select:       none;
    -moz-user-drag:         none;
    -khtml-touch-callout:   none;
    -khtml-user-select:     none;
    -khtml-user-drag:       none;
    touch-callout:          none;
    user-select:            none;
}

img.icon   {
    width:                  32px;
}

img.IDPhoto{
    width:                  36%;
}
img.TopImage{
    width:                  48%;
}

video {
    background-color:       #9F9F9F;
}

header  {
    width:                  99vw;
    hight:                  50px;
    text-align:             center;
    position:               fixed;
    top:                    0;
    background:             var(--HeaderBackground);
}

footer  {
    width:                  99vw;
    hight:                  50px;    
    text-align:             center;
    position:               fixed;
    bottom:                 0;
    background:             var(--FooterBackground);
}

label {
    vertical-align:         middle;    
    font-size:              1.2rem;
    color:                  #FFFFFF;    
    height:                 38px;
    border:                 0px;
    border-radius:          1em;
    background:             var(--ButtonBackground);
}

button.menu {
    display:                block;
    text-align:             left;
    vertical-align:         middle;
    font-size:              1.2rem;
    color:                  #1F1F1F;
    width:                  98%;
    margin-top:             1vh;
    margin-bottom:          2vh;
    margin-left:            1%;
    margin-right:           1%;
    padding:                1%;
    border:                 0px;
    background:             var(--MenuButtonBackground);
}

button.button {
    vertical-align:         middle;
    font-size:              1.2rem;
    color:                  #FFFFFF;    
    margin:                 2px;
    padding:                2px;
    height:                 38px;    
    border:                 0px;
    border-radius:          1em;
    background:             var(--ButtonBackground);    
}

button.dummyButton {
    vertical-align:         middle;
    font-size:              1.2rem;
    color:                  #FFFFFF;    
    margin:                 2px;
    padding:                2px;
    height:                 38px;    
    border:                 0px;
    border-radius:          1em;
    background-color:       rgba(223,223,223,0.8);
}

button.dummyMenu{
    display:                block;
    text-align:             left;
    vertical-align:         middle;
    font-size:              1.2rem;
    color:                  #9F9F9F;
    width:                  98%;
    margin-top:             1vh;
    margin-bottom:          2vh;
    margin-left:            1%;
    margin-right:           1%;
    padding:                1%;
    border:                 0px;
    background-color:       rgba(223,223,223,0.8);
}

button.highlightDummyB{
    vertical-align:         middle;
    font-size:              1.2rem;
    color:                  #FFFFFF;    
    margin:                 2px;
    padding:                2px;
    height:                 38px;    
    border:                 0px;
    border-radius:          1em;
    background-color:       rgba(63,63,63,0.8);
}

button.highlightDummyM{
    display:                block;
    text-align:             left;
    vertical-align:         middle;
    font-size:              1.2rem;
    color:                  #FFFFFF;
    width:                  98%;
    margin-top:             1vh;
    margin-bottom:          2vh;
    margin-left:            1%;
    margin-right:           1%;
    padding:                1%;
    border:                 0px;
    background:             rgba(63,63,63,0.8);
}

button.ref {
    font-size:              1.2rem;
    color:                  #FF6F00;
    border:                 0px;
    background:             none;
}

a {
    color:                  #006FFF;
    border:                 0px;
    font-weight:            bold;
    text-decoration:        none;
}

em {
    color:                  #FF0000;
    font-family:            serif;
    font-weight:            bold;
    font-style:             normal;
}

h1 {
    margin-left:            10%;
    margin-right:           10%;    
    padding:                0.2em;
    color:                  #2F2F2F;
    font-weight:            bold;
    background:             var(--HeadLineBackground);
}

h2 {
    margin-left:            10%;
    margin-right:           10%;    
    padding:                0.2em;
    color:                  #1F1F1F;
    font-weight:            bold;
    background:             var(--HeadLineBackground);
}

h3 {
    margin-left:            10%;
    margin-right:           10%;    
    padding:                0.2em;
    color:                  #0F0F0F;
    font-weight:            bold;
    background:             var(--HeadLineBackground);
}

h4 {
    color:                  #000000;
    font-weight:            bold;
}

input{
    font-size:              1.2rem;
    background-color:       rgba(255,255,255,0.8);
}

input.img{
    background:             none;
}

table
{
    text-align:             left;
    margin-left:            5%;
    margin-right:           5%;    
    background:             none;
    display:                block;
}

table.Search
{
    margin-left:            5%;
    display:                block;    
}

textarea{
    font-size:              1.2rem;
    border-radius:          0.2em;
    width:                  100%;
    background-color:       rgba(255,255,255,0.8);
}

p {
    margin:                 0.5em;
    border-radius:          0.2em;
    background:             none;
    box-shadow:             2px 2px 4px #000000;
}