/* 기념이념 내용 콘텐츠 */
#content .content_area{width: 1400px; margin: 0 auto; padding-bottom: 150px;}


#content .content_area .text_top{display: block; font-size: 2rem; text-align: center; font-weight: 600;
line-height: 3.5rem; margin: 100px 0 200px; position: relative; letter-spacing: -1px; line-height: 3.5rem;}
#content .content_area .text_top span{color: var(--font-color-main);}
#content .content_area .text_top::before,
#content .content_area .text_top::after{content: ""; display: block; width: 50px; height: 50px;
position: absolute;}
#content .content_area .text_top::before{background: url(../images/content1/quotes_top.svg) no-repeat;
    top: -85px; left: 50%; transform: translate(-50%, -50%);}
#content .content_area .text_top::after{background: url(../images/content1/quotes_bottom.svg) no-repeat;
    bottom: -150px; left: 50%; transform: translate(-50%, -50%);}

#content .content_area hr{height: 1px; width: 1400px; background: #ccc; border: 0;}
    
#content .content_area h3{display: block; font-size: 2.5rem; text-align: center; margin-bottom: 40px;}
#content .content_area h4{display: block; font-size: 2rem; text-align: center; margin: 100px 0 50px;}
#content .content_area .title_paragraph{display: block; font-size: 1.1rem; text-align: center;
color: var(--font-color2); margin-bottom: 140px;}
#content .content_area strong{display: block; font-size: 2rem; color: var(--font-color-main);
text-align: center; margin-bottom: 60px;}


#content .content_area .safety_box{margin: 100px 0 170px;}
#content .content_area .safety_box .safety_div{width: 100%; height: 80px; border: 1px solid var(--font-color-main);
    border-radius: 15px; display: flex; justify-content: center; align-items: center; color: var(--font-color-main);
font-size: 1.5rem; font-weight: 500; text-align: center; padding: 10px 0;}
#content .content_area .safety_box .safety_ul{display: flex; gap: 20px; margin-top: 20px;}
#content .content_area .safety_box .safety_ul li{border: 1px solid var(--font-color3); border-radius: 15px;
width: 335px; height: 335px; display: flex; justify-content: center; align-items: center; flex-direction: column;}
#content .content_area .safety_box .safety_ul li dl{display: flex; flex-direction: column; gap: 50px;}
#content .content_area .safety_box .safety_ul li dt span{display: block; font-size: 80px; text-align: center;}
#content .content_area .safety_box .safety_ul li dd{display: block; font-size: 1.5rem; font-weight: 500;}


#content .content_area .safety_cube{display: flex; justify-content: center; gap: 60px;}
#content .content_area .cube_box{width: 300px; height: 300px; position: relative; perspective: 600px;}
#content .content_area .cube_box .slide_cube{width: 100%; height: 100%; transform: translateZ(-150px); transform-style: preserve-3d;
transition: all .5s ease-out;}
#content .content_area .cube_box:hover .slide_cube{transform: translateZ(-150px) rotate3d(0, 1, 0, -90deg);}
#content .content_area .cube_box .slide_cube .cube_face{position: absolute; width: 100%; height: 100%;}
#content .content_area .cube_box .slide_cube .cube_front{background: linear-gradient(131deg,rgba(255, 144, 79, 1) 0%, rgba(235, 99, 23, 1) 100%); transform: rotateY(0) translateZ(150px);
display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 30px; color: #fff; border: 2px solid rgb(224, 127, 0);}
#content .content_area .cube_box .slide_cube .cube_right{background: linear-gradient(134deg,rgba(255, 255, 255, 1) 0%, rgba(240, 240, 240, 1) 100%); transform: rotateY(90deg) translateZ(150px); border: 2px solid var(--font-color-main);
display: flex; justify-content: center; align-items: center;}
#content .content_area .cube_box .slide_cube .cube_front p{display: block; font-size: 1.5rem; font-weight: 500;}
#content .content_area .cube_box .slide_cube .cube_front span{font-size: 80px;}
#content .content_area .cube_box .slide_cube .cube_right p{display: block; font-size: 1.2rem; text-align: center; line-height: 2.5rem;
color: var(--font-color-main); font-weight: 500;}

#content .content_area .human_rights_box{margin: 100px 0;}
#content .content_area .human_rights_box div{width: 1000px; height: 100px; background: linear-gradient(131deg,rgba(255, 144, 79, 1) 0%, rgba(235, 99, 23, 1) 100%); margin: 0 auto;
display: flex; justify-content: center; align-items: center; gap: 30px; border-radius: 15px; box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, .2);}
#content .content_area .human_rights_box div p{display: block; color: #fff; font-size: 2rem; font-weight: 500;}
#content .content_area .human_rights_box ul{width: 1000px; display: flex; justify-content: center; align-items: center; margin: 20px auto 0; flex-wrap: wrap; gap: 20px;}
#content .content_area .human_rights_box ul li{width: 320px;height: 320px; background: #fff; border-radius: 15px; box-shadow: 2px 2px 10px 0 rgba(0, 0, 0, .2);
display: flex; justify-content: center; align-items: center;}
#content .content_area .human_rights_box ul li dl{display: flex; flex-direction: column; align-items: center; gap: 20px;}
#content .content_area .human_rights_box ul li dl dt span{font-size: 80px; color: var(--font-color2);}
#content .content_area .human_rights_box ul li dl dd{font-size: 1.2rem; color: var(--font-color2); font-weight: 500;}

#content .content_area .consumer_box{margin: 100px 0;}
#content .content_area .consumer_box ul{width: 1000px; display: flex; justify-content: center; gap: 20px;  margin: 0 auto;}
#content .content_area .consumer_box ul:nth-of-type(2){margin-top: 20px; flex-wrap: wrap;}
#content .content_area .consumer_box ul:nth-of-type(1) li{width: 235px; height: 235px; border: 1px solid #ccc; border-radius: 15px;
display: flex; justify-content: center; align-items: center;}
#content .content_area .consumer_box ul:nth-of-type(1) li dl{display: flex; align-items: center; flex-direction: column; gap: 15px;}
#content .content_area .consumer_box ul:nth-of-type(1) li dl dt span{font-size: 50px; color: var(--font-color2);}
#content .content_area .consumer_box ul:nth-of-type(1) li dl dd:nth-of-type(1){font-size: 1.5rem; color: var(--font-color-main); font-weight: 500;}
#content .content_area .consumer_box ul:nth-of-type(1) li dl dd:nth-of-type(2){text-align: center; color: var(--font-color2);}
#content .content_area .consumer_box ul:nth-of-type(2) li{background: #f6f6f6; width: 490px; height: 100px; border-radius: 15px;
display: flex; justify-content: center; align-items: center; color: var(--font-color2); font-size: 1.1rem;}

#content .content_area .consumer_box .ccm{width: 1400px; height: 400px; background: url(../images/content3/ccm.jpg) no-repeat; border-radius: 15px;
display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 20px;}
#content .content_area .consumer_box .ccm p{display: block; font-size: 2rem; font-weight: 600; color: #fff; margin-left: 80px;}
#content .content_area .consumer_box .ccm a{background: var(--font-color-main); width: 140px; height: 46px; color: #ffff; border-radius: 15px;
display: flex; justify-content: center; align-items: center; border: 2px solid var(--font-color-main); transition: all .3s ease-out;
margin-left: 80px;}
#content .content_area .consumer_box .ccm a:hover{background: #fff; color: var(--font-color-main);}

#content .content_area .local_box{margin-top: 100px;}
#content .content_area .local_box ul{width: 1400px; display: flex; justify-content: center; align-items: center; gap: 30px;}
#content .content_area .local_box ul li{width: 350px; height: 350px; background: linear-gradient(131deg,rgba(255, 144, 79, 1) 0%, rgba(235, 99, 23, 1) 100%); border-radius: 50%;
display: flex; justify-content: center; align-items: center; transition: all .3s ease-out;}
#content .content_area .local_box ul li:hover{transform: scale(1.05); box-shadow: 3px 3px 15px 0 rgba(0, 0, 0, .3);}
#content .content_area .local_box ul li dl{display: flex; justify-content: center; align-items: center; flex-direction: column; color: #fff;
gap: 20px;}
#content .content_area .local_box ul li dl dt img{scale: 0.6; margin: -13px 0;}
#content .content_area .local_box ul li dl dt span{font-size: 70px;}
#content .content_area .local_box ul li dl dd:nth-of-type(1){font-size: 1.4rem; font-weight: 500;}
#content .content_area .local_box ul li dl dd:nth-of-type(2){text-align: center; margin-bottom: 10px;}