@charset "UTF-8";
/* CSS Document */
/* 基本-モバイルファースト ======================================================================================================== */

#ceo #top_copy{
margin-bottom: 40px;
}
#ceo #top_copy .photo{
position: relative;
}
#ceo #top_copy .photo::after{
content: "";
display: block;
width: 100%;
height: 100%;
background-color: #dddbcc;
background: -webkit-linear-gradient(rgba(221,219,204,0) 50%, rgba(221,219,204,1) 100%);
background: linear-gradient(rgba(221,219,204,0) 50%, rgba(221,219,204,1) 100%);
position: absolute;
top: 0;
left: 0;
}
#ceo #top_copy .copy{
background-color: #dddbcc;
padding: 5vw;
text-align: left;
position: relative;
}
#ceo #top_copy .copy h4{
font-size: 5vw;
margin-bottom: 10px;
}
#ceo #top_copy .copy .name{
display: flex;
align-items: center;
justify-content: flex-end;
}
#ceo #top_copy .copy .anniversary{
width: 30vw;
position: absolute;
top: -20vw;
right: 3vw;
}

#ceo #comment{
padding: 5vw;
text-align: left;
}


/* PCのみ======================================================================================================== */
@media print and (min-width: 751px), screen and (min-width: 751px){

#ceo #top_copy{
display: flex;
height: 25vw;
overflow: hidden;
margin-bottom: 60px;
}
#ceo #top_copy .photo{
width: 50%;
margin-top: -5vw;
}
#ceo #top_copy .photo::after{
background: -webkit-linear-gradient(90deg, rgba(221,219,204,0) 50%, rgba(221,219,204,1) 100%);
background: linear-gradient(90deg, rgba(221,219,204,0) 50%, rgba(221,219,204,1) 100%);
}
#ceo #top_copy .copy{
width: 50%;
padding: 0 5vw;
display: flex;
flex-direction: column;
justify-content: center;
}
#ceo #top_copy .copy h4{
font-size: 2vw;
margin-bottom: 1vw;
}
#ceo #top_copy .copy .name{
}
#ceo #top_copy .copy .anniversary{
width: 10vw;
top: 7vw;
right: 5vw;
}


#ceo #comment{
padding: 0;
font-size: 16px;
display: inline-block;
}



}